怎么请求小程序直播_javascript完成文字无缝滚动

javascript实现文字无缝滚动       这篇文章主要介绍了javascript实现文字无缝滚动,文字可以实现上下滚动,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

效果如图:

html:( 一个div 包裹两个ul )

 div id="box" 
 ul id="ul1" 
 li a href="#" 1.学会html5 绝对的屌丝逆袭(案例) /a span  /span /li 
 li a href="#" 2.tab页面切换效果(案例) /a span  /span /li 
 li a href="#" 3.圆角水晶按钮制作(案例) /a span  /span /li 
 li a href="#" 4.HTML+CSS基础课程(系列) /a span  /span /li 
 li a href="#" 5.分页页码制作(案例) /a span  /span /li 
 li a href="#" 6.导航条菜单的制作(案例) /a span  /span /li 
 li a href="#" 7.信息列表制作(案例) /a span  /span /li 
 li a href="#" 8.下拉菜单制作(案例) /a span  /span /li 
 li a href="#" 9.如何实现“新手引导”效果 /a span  /span /li 
 /ul 
 ul id="ul2" /ul 
 /div 

js代码:

window.onload=roll;
function roll(){
 var ul1=document.getElementById("ul1");
 var ul2=document.getElementById("ul2");
 var box=document.getElementById("box");
 ul2.innerHTML=ul1.innerHTML;
 box.scrollTop = 0;
 var timer=setInterval(rollStart,50);
 box. unction(){
 clearInterval(timer)
 box.onmouseout=function(){
 timer=setInterval(rollStart,50);

function rollStart(){ if (box.scrollTop =ul1.scrollHeight) {//scrollTop属性既是scroll最上端和box的距离 box.scrollTop=0; }else{ box.scrollTop++;

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持凡科。