原生js轮播算法

来源:互联网 发布:vb.net 复制文件夹 编辑:程序博客网 时间:2024/05/22 12:43
OC.Homepage = {    /*滚动效果    函数startmarquee的参数:    lh : 文字一次向上滚动的距离或者高度;(样式高度也要修改)(可配置样式高度和整理一样来显示一次滚动几条);    speed : 滚动速度    delay : 滚动停顿的时间间隔    index : 可以使分装后的函数应用于页面中不同的元素    */    startmarquee : function(ln,speed,delay,index){        var t;        var p = false;//p是true还是fasle直接影响到下面start()函数的执行        //获取文档中的滚动区域对象        var o = document.getElementById("notice_ul");        var li_count = o.getElementsByTagName("li").length;        if(li_count * 25 <= o.offsetHeight){            return;        }        o.innerHTML +=  o.innerHTML; //对象中的实际内容被复制了一份,复制的目的在于给文字给文字不间断向上滚刀提供过渡        //鼠标滑过,停止滚动        o.onmouseover = function(){ p = true; }        o.onmouseout = function(){ p = false; }        //文字内容顶端与滚动区域顶端的距离,初始值为0(卷起的距离)        0.scrollTop = 0;        function start(){            t = setInterval(scrolling,speed);            //滚动停止或者开始,取决于b传过来的布尔值            if(!p){                o.srcollTop += 1;            }        }        function scrolling(){            //如果不被整除,即上一次上移动的高度达不到lh,则内容会继续向上滚动            if(o.scrollTop % lh != 0){                o.scrollTop += 1;                //对象o中的内容之前被复制了一次,所以它的滚动高度,其实是原来内容的两倍高度;                //当内容向上滚动到scrollHeight/2的高度时,全部3行文字已近显示了一遍,至此                //srcollTop归0,再等待一下轮的滚动,从而达到文字不间断向上滚动的效果;                if(o.scrollTop >= o.scrollHeight / 2){                    o.scrollTop = 0;                }else{                    //否则清除t,暂停滚动                    clearInterval(t);                    //经过delay间隔后,启动start() 再连续滚动                }            }        }        //第一次启动滚动;setTimeout会在一定的时间后执行start(),且只执行一次        setTimeout(start,delay);    }}
0 0
原创粉丝点击