博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JavaScript实现竖直文本滚动
阅读量:4285 次
发布时间:2019-05-27

本文共 1947 字,大约阅读时间需要 6 分钟。

一、HTML代码

	
Scroll Text
二、CSS代码

body{	font-size:15px;	font-family: 'Microsoft YaHei','微软雅黑','SimSun','宋体';	margin: 0px;	padding: 0px;	text-align: center;}a{	color:#666666;	text-decoration: none;	display: block;	line-height: 1.5em;}a:hover{	color: #CC0000;	text-decoration: none;}.news_root{	width: 255px;	height: 134px;	text-align: left;	margin: 0 auto;	border: 1px solid #ccc;}.news_header{	width: 243px;	height: 16px;	vertical-align: top;	text-align: left;	font-size: 14px;	padding: 6px;	background-color: #ccc;}#scrollContainer{	width: 245px;	margin: 2px 5px;	overflow: hidden;	text-align: left;}
三、Javascript代码

var stopscroll = false;var scrollContHeight = 95;   //滚动区域的高度var scrollContWidth = 230;   //滚动区域的宽度var scrollSpeed = 25;        //滚动的速度,越小滚动越快var scrollContainer = document.getElementById("scrollContainer");var scrollContent = document.getElementById("scrollContent");do{	scrollContainer.appendChild(scrollContent.cloneNode(true));}while(scrollContainer.offsetHeight < scrollContHeight);scrollContainer.style.width = scrollContWidth+"px";scrollContainer.style.height = scrollContHeight+"px";scrollContainer.noWrap = true;//添加事件:鼠标经过,停止滚动;鼠标离开,继续滚动scrollContainer.onmouseover = new Function("stopscroll = true");scrollContainer.onmouseout = new Function("stopscroll = false");function init(){	scrollContainer.scrollTop = 0;	setInterval(scrollUp,scrollSpeed);}init();var currTop = 0;function scrollUp(){	if(stopscroll == true)		return;	currTop = scrollContainer.scrollTop;	scrollContainer.scrollTop += 1;	if(currTop == scrollContainer.scrollTop)	{		scrollContainer.scrollTop = 0;		scrollContainer.scrollTop += 1;	}}

转载地址:http://uevgi.baihongyu.com/

你可能感兴趣的文章
论文笔记 | Leveraging Graph to Improve Abstractive Multi-Document Summarization
查看>>
NAACL2021丨Knowledge Guided Metric Learning for Few-Shot Text Classification
查看>>
论文笔记|Deep Open Intent Classification with Adaptive Decision Boundary
查看>>
【论文笔记】
查看>>
论文笔记_Pay Attention to MLPs
查看>>
【论文笔记】
查看>>
论文笔记
查看>>
论文笔记 | Attention-based LSTM for Aspect-level Sentiment Classification
查看>>
【论文笔记】Joint Extraction of Entities and Relations Based on a Novel Tagging Scheme
查看>>
论文笔记|Bidirectional LSTM-CRF Models for Sequence Tagging
查看>>
论文笔记:Constructing Narrative Event Evolutionary Graph for Script Event Prediction
查看>>
论文笔记丨Open Hierarchical Relation Extraction
查看>>
论文笔记| BART:Denoising Sequence-to-Sequence Pre-training for Natural Language Generation, Translation
查看>>
【论文笔记】 | Learning to Retrieve Reasoning Paths over Wikipedia Graph for Question Answering
查看>>
论文笔记 | Adversarial Examples for Evaluating Reading Comprehension Systems
查看>>
2021-06-12
查看>>
论文笔记| The Emergence, Advancement and Future of Textual Answer Triggering
查看>>
论文笔记|Open Set Text Classification using Convolutional Neural Networks
查看>>
论文笔记: Hierarchical Chinese Legal event extraction via Pedal Attention Mechanism
查看>>
论文笔记 | Enhancing Pre-Trained Language Representations with Rich Knowledge for MRC
查看>>