html 文字上下滚动

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

猜你在找的HTML相关文章