首页 > 代码库 > css 上下滚动效果
css 上下滚动效果
<html><head><style>.scroll{ overflow:hidden; width:100%;}.scrollout{ height:250px; width:100%; overflow:hidden; cursor:pointer; }</style><script type="text/javascript" src="http://www.mamicode.com/jquery.js"></script><script> //无缝滚动 var rclone=$("#rscroll").html();//这里要用html而不能用clone,html()方法是获取html代码，你是要加长html代码，clone方法是要复制节点信息 $("#rscrollout").append(rclone);//其次，你滚动的内容长度要大于200+scrollTop的高度才能进行滚动 var lclone=$("#lscroll").html(); $("#lscrollout").append(lclone); var speed=1; var NY=window.setInterval(scroll2,100); function scroll2(){ var scrollTop=$(".scrollout").scrollTop()+speed; if(scrollTop==400){ scrollTop=0; } $(".scrollout").scrollTop(scrollTop); } $(".scrollout").hover(function(){clearInterval(NY)},function(){NY=setInterval(scroll2,100);});</script></head><body><div class="scrollout" id="rscrollout"> <div id="rscroll" class="scroll" style="height:400px;"> <ul> <li>1</li> <li>11</li> <li>111</li> <li>1111</li> <li>11111</li> <li>111111</li> <li>1111111</li> <li>11111111</li> <li>111111111</li> <li>1111111111</li> <li>11111111111</li> <li>111111111111</li> <li>1111111111111</li> <li>11111111111111</li> <li>111111111111111</li> </ul> </div></div></body></html>
css 上下滚动效果
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。