2013-10-31 20 views
0

我正在使用動態驅動器的跨瀏覽器選取框II滾動條腳本find here。我有一些幫助來改變腳本,其中內容在頁面加載時具有隨機的StartIndex,並且隨機部分工作良好;該論壇的主題是here。我現在遇到的問題是,改變的腳本不會在MouseOver函數上產生暫停。我製作了一個JSFiddle here並嘗試了所有我能想到的方法來修復它,但是我被卡住了。 JavaScript如下:在MouseOver上暫停不能使用跨瀏覽器選框II

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; 

這可能是一個真正簡單的修復我只是沒有捕捉到。任何幫助將不勝感激。另外,有沒有人知道一種方法來使滾動器的最後一個和第一個項目之間沒有空格在列表中滾動?

回答

0

這現在已經修復,並完全跨瀏覽器和twitter引導友好。你可以看看新編輯的jsfiddle here。固定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;