JS文字间歇循环滚动效果怎么实现

这次给大家带来JS文字间歇循环滚动效果怎么实现，JS文字间歇循环滚动效果实现的有哪些，下面就是实战案例，一起来看一下。

具体代码如下：

nbsp;html>

<meta><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><p>
  </p>

    
• PHP1

    

• PHP2

    

• PHP3

    

• PHP4

    

• PHP5

    

• PHP6

    

• PHP7

    

• PHP8

    

• PHP9

  

<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>

相信看了本文案例你已经掌握了方法，更多精彩请关注有卡有网。