0

我正在使用 Dynamic Drive 的 Cross Browser Marquee II 滚动脚本在这里找到。我有一些帮助来改变脚本,其中内容在页面加载时会有一个随机的 StartIndex 并且随机部分工作得很好;论坛主题在这里。我现在遇到的问题是更改后的脚本没有在 MouseOver 函数上产生暂停。我在这里做了一个 JSFiddle并尝试了我能想到的一切来修复它,但我被卡住了。JavaScript如下:

function scrollmarquee() {
    if (parseInt(cross_marquee.style.top) > (actualheight * (-1) + 8)) {
        cross_marquee.style.top = parseInt(cross_marquee.style.top) - copyspeed + "px";
    } else {
        cross_marquee.style.top = parseInt(marqueeheight) + 8 + "px";
    }
}

function marqueescroll(o) {
    marqueePause(o.id);
    o.srt += o.ss;
    if ((o.ss < 0 && o.srt > o.h) || (o.ss > 0 && o.srt < o.ph)) {
        o.s.style.top = o.srt + 'px';
    } else {
        o.srt = o.ss < 0 ? o.ph : o.h;
        o.s.style.top = o.srt + 'px';
    }
    o.to = setTimeout(function () {
        marqueescroll(o);
    }, 60);
}

function marquee(o) {
    var id = o.ID,
        ss = o.Speed,
        i = o.StartIndex,
        srt = o.AutoDelay,
        p = document.getElementById(id),
        s = p ? p.getElementsByTagName('DIV')[0] : null,
        ary = [],
        z0 = 0;
    if (s) {
        var clds = s.childNodes,
            o = marquee[id] = {
                id: id,
                p: p,
                h: -s.offsetHeight,
                ph: p.offsetHeight,
                s: s,
                ss: typeof (ss) == 'number' && ss != 0 ? ss : -2,
                srt: 0
            }
        for (; z0 < clds.length; z0++) {
            if (clds[z0].nodeType == 1) {
                ary.push(clds[z0]);
            }
        }
        ary[i] ? o.srt = -ary[i].offsetTop : null;
        o.s.style.position = 'absolute';
        o.s.style.top = o.srt + 'px';
        typeof (srt) == 'number' && srt > 1 ? marqueeAuto(id, srt) : null;
    }
}

function marqueeAuto(id, ms) {
    var o = marquee[id];
    o ? o.to = setTimeout(function () {
        marqueescroll(o);
    }, ms || 200) : null;
}

function marqueePause(id) {
    var o = marquee[id];
    o ? clearTimeout(o.to) : null;
}

function marqueeInit() {
    marquee({
        ID: 'marqueecontainer', // the unique ID name of the parent DIV.(string)
        AutoDelay: 2000, //(optional) the delay before starting scroll in milli seconds. (number, default = no auto scroll)
        Speed: -1, //(optional) the scroll speed, < 0 = up. > 0 = down.            (number, default = -2)
        StartIndex: Math.floor(Math.random() * 4) //(optional) the index number of the element to start.          (number, default = 0)
    });
}

if (window.addEventListener) window.addEventListener("load", marqueeInit, false);
else if (window.attachEvent) window.attachEvent("onload", marqueeInit);
else if (document.getElementById);
window.onload = marqueeInit;

这可能是一个真正简单的修复,我只是没有抓住。任何帮助将不胜感激。另外,有没有人知道一种使滚动条在列表中滚动的最后一个项目和第一个项目之间没有空格的方法?

4

1 回答 1

0

这个问题现在已经修复,并且完全跨浏览器和 twitter 引导程序友好。您可以在此处查看新编辑的 jsfiddle 。固定的javascript如下:

 function marqueescroll(o) {
     marqueePause(o.id);
     o.srt += o.ss;
     if ((o.ss < 0 && o.srt > o.sz) || (o.ss > 0 && o.srt < (o.w ? -o.sz : o.psz))) {
     o.s.style[o.m] = o.srt + 'px';
     } else {
         o.srt = (o.w ? 0 : o.ss < 0 ? o.psz : o.sz) + o.ss;
         o.s.style[o.m] = o.srt + 'px';
     }
     o.to = setTimeout(function () {
         marqueescroll(o);
     }, 30);
 }

 function marquee(o) {
     var id = o.ID,
         m = o.Mode,
         ss = o.Speed,
         i = o.StartIndex,
         srt = o.AutoDelay,
         p = document.getElementById(id),
         s = p ? p.getElementsByTagName('DIV')[0] : null,
         clds = s ? s.childNodes : [],
         ary = [],
         sz, l, z0 = 0;
     if (s && !marquee[id]) {
         var m = typeof (m) == 'string' && m.charAt(0).toUpperCase() == 'H' ? ['left', 'offsetLeft', 'offsetWidth'] : ['top', 'offsetTop', 'offsetHeight'],
             sz = p[m[2]],
             slide = document.createElement('DIV'),
             c;
         slide.style.width = 'inherit',//added this for fluid bootstrap width
         slide.style.position = s.style.position = 'absolute';
         for (; z0 < clds.length; z0++) {
             if (clds[z0].nodeType == 1) {
                 if (m[0] == 'left') {
                     clds[z0].style.position = 'absolute';
                     clds[z0].style.left = sz * ary.length + 'px';
                     clds[z0].style.top = '0px';
                 }
                 ary.push([clds[z0], clds[z0][m[1]]]);
             }
         }
         l = ary[ary.length - 1][0];
         o = marquee[id] = {
             m: m[0],
             id: id,
             p: p,
             sz: -(l[m[1]] + l[m[2]]),
             psz: sz,
             s: slide,
             ss: typeof (ss) == 'number' && ss != 0 ? ss : -2,
             w: o.Wrap !== false
         }
         o.s.appendChild(s);
         c = s.cloneNode(true);
         c.style.left = c.style.top = '0px';
         c.style[m[0]] = o.sz * (ss > 0 ? 1 : -1) + 'px';
         o.w ? o.s.appendChild(c) : null;
         o.srt = ary[i] ? -ary[i][1] : 0;
         o.s.style.position = 'absolute';
         o.s.style[m[0]] = o.srt + 'px';
         p.appendChild(o.s);
         p.style.overflow = 'hidden';
         typeof (srt) == 'number' && srt > 1 ? marqueeAuto(id, srt) : null;
     }
 }

 function marqueeAuto(id, ms) {
     var o = marquee[id];
     o ? o.to = setTimeout(function () {
         marqueescroll(o);
     }, ms || 200) : null;
 }

 function marqueePause(id) {
     var o = marquee[id];
     o ? clearTimeout(o.to) : null;
 }

 function marqueeInit() {

     marquee({
         ID: 'marqueecontainer', // the unique ID name of the parent DIV.                        (string)
         Mode: 'vertical', // the display type, 'vertical' or 'horizontal'                 (string. defalut = 'vertical')
         AutoDelay: 2000, //(optional) the delay before starting scroll in milli seconds. (number, default = no auto scroll)
         Speed: -2, //(optional) the scroll speed, < 0 = up. > 0 = down.            (number, default = -2)
         Wrap: true, //(optional) true = no gap, false = gap.                        (boolean, default = true)
         StartIndex: Math.floor(Math.random() * 4) //(optional) the index number of the element to start.          (number, default = 0)
     });

 }

 if (window.addEventListener) window.addEventListener("load", marqueeInit, false);
 else if (window.attachEvent) window.attachEvent("onload", marqueeInit);
 else if (document.getElementById) window.onload = marqueeInit;
于 2013-10-31T21:45:37.770 回答