这次给大家带来JS文字间歇循环滚动效果怎么实现，JS文字间歇循环滚动效果实现的注意事项有哪些，下面就是实战案例，一起来看一下。
具体代码如下：
<!DOCTYPE html><html><head><meta charset="utf-8"/><title>www.jb51.net - 间歇循环滚动</title><style>#box{ height:240px; width:300px; margin:0 auto; border:1px solid #0066FF; overflow:hidden; padding-bottom:20px;}#box li{ color:#333; height:24px;}#box ul{ margin:0; padding:0;}</style></head><body><p id="box"> <ul id="con1"> <li>PHP1</li> <li>PHP2</li> <li>PHP3</li> <li>PHP4</li> <li>PHP5</li> <li>PHP6</li> <li>PHP7</li> <li>PHP8</li> <li>PHP9</li> </ul></p><script>var area=document.getElementById("box");area.innerHTML+=area.innerHTML;var liHeight=24;area.scrollTop=0;var delay=2000;var speed=50;var time;function starMove(){ area.scrollTop++; time=setInterval("scrollUp()",speed);}function scrollUp(){ if(area.scrollTop%liHeight==0){ clearInterval(time); setTimeout("starMove()",delay); }else{ area.scrollTop++; if(area.scrollTop>=area.offsetHeight/2){ area.scrollTop=0; } }}setTimeout("starMove()",delay);</script></body></html>相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！
推荐阅读：
JS运动缓冲效果的封装函数如何使用
JavaScript的异步加载详解
