您好,欢迎来到汇意旅游网。
搜索
您的当前位置:首页JS左右无缝滚动(一般方法+面向对象方法)_javascript技巧

JS左右无缝滚动(一般方法+面向对象方法)_javascript技巧

来源:汇意旅游网
代码如下:




JS左右无缝滚动(一般方法+面向对象方法)


window.onload=function(){ //一般方法
var wrap=document.getElementById("wrap");
var wrap_ul=wrap.getElementsByTagName("ul")[0];
var wrap_li=wrap.getElementsByTagName("li");
wrap_ul.innerHTML+=wrap_ul.innerHTML;
wrap_ul.style.width=(wrap_li[0].offsetWidth+20)*wrap_li.length+"px";
Autoscroll=setInterval(scroll,100);
function scroll(){
wrap_ul.style.left=wrap_ul.offsetLeft-3+"px"; //这里因为ie对offsetLeft的解析不一样,所以ie下必须减大于等于3的数
if(wrap_ul.offsetLeft<=-wrap_ul.offsetWidth/2){
wrap_ul.style.left="0px";
}else if(wrap_ul.offsetLeft>=0){
wrap_ul.style.left=-wrap_ul.offsetWidth/2+"px";
}
}
wrap.onmouseover=function(){
clearInterval(Autoscroll);
}
wrap.onmouseout=function(){
Autoscroll=setInterval(scroll,100);
}
}

Copyright © 2019- hids.cn 版权所有 赣ICP备2024042780号-1

违法及侵权请联系:TEL:199 1889 7713 E-MAIL:2724546146@qq.com

本站由北京市万商天勤律师事务所王兴未律师提供法律服务