前端之家收集整理的这篇文章主要介绍了
html 文字上下滚动,
前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
经测试
代码如下:
<!DOCTYPE html><html>
<head>
<Meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="hdemo" style="height:200px;overflow:hidden;">
<div id="indemo" style="height:200%;">
<div id="hdemo1">
第一行字<br />
第二行字</div>
<div id="hdemo2"></div>
</div>
</div>
</body>
</body>
</html>
<!-- 代码来自 编程之家 jb51.cc (jb51.cc)-->
相关JS:经测试
代码如下:
<script type="text/javascript">
speed = 100; //数字越大滚得越慢
var htab = document.getElementById("hdemo");
var htab1 = document.getElementById("hdemo1");
var htab2 = document.getElementById("hdemo2");
htab2.innerHTML = htab1.innerHTML;
htab.scrollTop = htab1.offsetHeight;
function Marquee(){if (htab.scrollTop >= htab1.offsetHeight) {
htab.scrollTop-=htab2.offsetHeight;
}else{
htab.scrollTop+=1;
}
}var MyMar=setInterval(Marquee,speed);
</script>
// 来自:编程之家 jb51.cc(jb51.cc)