偶尔出现鼠标快速移开的时候就会滚动的很快,不知道是浏览器的问题还是bug,求解?
偶尔出现鼠标快速移开的时候就会滚动的很快,不知道是浏览器的问题还是bug,求解?
偶尔出现鼠标快速移开的时候就会滚动的很快,不知道是浏览器的问题还是bug,求解?
2016-12-28
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>滚动测试</title> <style> li{ list-style: none; } #g1,#g2{ width: 450px; height: 200px; overflow: hidden; border: 1px solid #CCCCCC; } #g1 ul,#g2 ul{ display: block; margin: 0; width: 430px; padding-left: 10px; } #g1 li,#g2 li{ height: 40px; border-bottom: 1px dotted #ccc; line-height: 35px; } #g1 span,#g2 span{ color: #ff5203; margin-left: 50px; } </style> </head> <body> <h1>文字无缝滚动</h1> <div id="g1"> <ul id="con1"> <li>1、滚动的内容滚动的内容滚动的内容<span>2016-12-27</span></li> <li>2、滚动的内容滚动的内容滚动的内容<span>2016-12-27</span></li> <li>3、滚动的内容滚动的内容滚动的内容<span>2016-12-27</span></li> <li>4、滚动的内容滚动的内容滚动的内容<span>2016-12-27</span></li> <li>5、滚动的内容滚动的内容滚动的内容<span>2016-12-27</span></li> <li>6、滚动的内容滚动的内容滚动的内容<span>2016-12-27</span></li> </ul> <ul id="con2"></ul> </div> <script> var con=document.getElementById('g1'); var con1=document.getElementById('con1'); var con2= document.getElementById('con2'); con2.innerHTML = con1.innerHTML; function scrollUp(){ if(con.scrollTop >= con1.offsetHeight){ con.scrollTop = 0; }else{ con.scrollTop++; } } var time=50; myScroll=setInterval('scrollUp()',time); con.onmouseover = function(){ clearInterval(myScroll); } con.onmouseout = function(){ myScroll = setInterval("scrollUp()",time); } </script> <h1>文字间歇性滚动</h1> <div id="g2"> <ul > <li>1、滚动的内容滚动的内容滚动的内容<span>2016-12-27</span></li> <li>2、滚动的内容滚动的内容滚动的内容<span>2016-12-27</span></li> <li>3、滚动的内容滚动的内容滚动的内容<span>2016-12-27</span></li> <li>4、滚动的内容滚动的内容滚动的内容<span>2016-12-27</span></li> <li>5、滚动的内容滚动的内容滚动的内容<span>2016-12-27</span></li> <li>6、滚动的内容滚动的内容滚动的内容<span>2016-12-27</span></li> </ul> <script> var are=document.getElementById('g2'); var iLiHeight=41; are.innerHTML+=are.innerHTML; are.scrollTop=0; var speed=50; var delay=2000; var time; function starMove(){ time = setInterval('scrollUp2()',speed); are.scrollTop++; } function scrollUp2(){ if(are.scrollTop % iLiHeight == 0 ){ clearInterval(time); setTimeout(starMove,delay); }else{ are.scrollTop++; if(are.scrollTop>= are.scrollHeight/2){ are.scrollTop=0; } } } setTimeout(starMove,delay); </script> </div> </body> </html>
举报