Discuz教程网

JS垂直方向连续滚动字幕的实现

[复制链接]
authicon dly 发表于 2011-12-6 21:27:23 | 显示全部楼层 |阅读模式
最近想实现在垂直方向上滚动字幕,并切实现字幕的无缝连接   
即在屏幕的指定区域,嵌入一段很长的文字,文字由下向上滚动,当滚   动到最末一行,首行立即紧跟着最末一行出来,与最末一行同时在一 个屏幕内滚动。
  1. 里面可以加图片,还可加链接


  2. <div id=demo style=overflow:hidden;height:70;width:400>
  3. <div id=demo1>
  4. <a href='' target='_blank'>这是滚动第1行</a><br>
  5. 这是滚动第2行<br>
  6. 这是滚动第3行<br>
  7. 这是滚动第4行<br>
  8. 这是滚动第5行<br>
  9. 这是滚动第6行<br>
  10. 这是滚动第7行<br>
  11. 这是滚动第8行<br>
  12. </div>
  13. <div id=demo2></div>
  14. </div>
  15. <script>
  16. var speed=30
  17. demo2.innerHTML=demo1.innerHTML
  18. function Marquee()
  19. {
  20. if(demo2.offsetTop-demo.scrollTop<=0)
  21. demo.scrollTop-=demo1.offsetHeight
  22. else
  23. {
  24. demo.scrollTop++
  25. }
  26. }
  27. var MyMar=setInterval(Marquee,speed)
  28. demo.onmouseover=function() {clearInterval(MyMar)}
  29. demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
  30. </script>
复制代码




上一篇:求视频展厅内置数据
下一篇:下载搜街评店模板,但是不知道该怎么应用,求诸葛哥指教
authicon 亘古つ守侯珊 发表于 2011-12-7 08:44:33 | 显示全部楼层
最好能给个演示地址 看下效果!


看帖回帖是种美德!
           强势围观~~  
                围观无罪!   
authicon  楼主| dly 发表于 2011-12-7 09:31:33 | 显示全部楼层
亘古つ守侯珊 发表于 2011-12-7 08:44
最好能给个演示地址 看下效果!

把代码保存成html文件,自己打开就能看到效果
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

1314学习网 ( 浙ICP备10214163号 )

GMT+8, 2025-5-2 07:25

Powered by Discuz! X3.4

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表