连续图像垂直滚动条

Continuous Image Vertical Scroller

本文关键字:滚动条 垂直 图像 连续      更新时间:2023-09-26

我需要从http://javascript.about.com/library/blcvert.htm将滚动方向更改为向下。

有人能帮忙吗?

当然,如果有人知道/有其他能产生同样效果的剧本,那也会很有帮助。

Thanx

附言:脚本(可读格式为):


    var imgAry1 = ['img1.png','img2.png'];
    function startCloud() {
       new mq('clouds', imgAry1, 380);
       mqRotate(mqr);
    }
    $(document).ready(function() {
        startCloud();
    });
    var mqr = [];
    function mq(id, ary, heit) {
    this.mqo=document.getElementById(id);
    var wid = this.mqo.style.width;
    this.mqo.onmouseout=function() { mqRotate(mqr); };
    this.mqo.onmouseover=function() { clearTimeout(mqr[0].TO); };
    this.mqo.ary=[];
    var maxw = ary.length;
    for (var i=0;i<maxw;i++) {
        this.mqo.ary[i]=document.createElement('img');
        this.mqo.ary[i].src=ary[i];
        this.mqo.ary[i].style.position = 'absolute';
        this.mqo.ary[i].style.top = (heit*i)+'px';
        this.mqo.ary[i].style.height = heit+'px';
        this.mqo.ary[i].style.width = wid;
        this.mqo.appendChild(this.mqo.ary[i]);
    }
    mqr.push(this.mqo);
    }
    function mqRotate(mqr) {
    if (!mqr) return;
    for (var j=mqr.length - 1; j > -1; j--) {
        maxa = mqr[j].ary.length;
        for (var i=0;i<maxa;i++) {
            var x = mqr[j].ary[i].style;
            x.top=(parseInt(x.top,10)-1)+'px';
        }
        var y = mqr[j].ary[0].style;
        if (parseInt(y.top,10)+parseInt(y.height,10)<0) {
            var z = mqr[j].ary.shift();
            z.style.top = (parseInt(z.style.top) + parseInt(z.style.height)*maxa) + 'px';
            mqr[j].ary.push(z);
        }
    }
    mqr[0].TO=setTimeout('mqRotate(mqr)',10);
    }

在这一行:

x.top=(parseInt(x.top,10)-1)+'px';

它说你以像素为单位取x.top,解析出数字,减去一,再加上"px"。元素从顶部开始的位置每次减少1,因此它向上。要使其向下,只需添加即可。

x.top=(parseInt(x.top,10)+1)+'px';

我还在你链接的页面上测试了这个假设:)