在MouseOver上暫停滑塊幻燈片

我修改了滑塊腳本以模仿主頁上的易趣滑塊。我對Javscript不夠熟悉，無法修改代碼以允許幻燈片在mouseover上暫停。任何幫助，將不勝感激。在MouseOver上暫停滑塊幻燈片

Javascript代碼：

var TINY={}; 

function T$(i){return document.getElementById(i)} 
function T$$(e,p){return p.getElementsByTagName(e)} 

TINY.fader=function(){ 
function fade(n,p){this.n=n; this.init(p)} 
fade.prototype.init=function(p){ 
    var s=T$(p.id), u=this.u=T$$('li',s), l=u.length, i=this.l=this.c=this.z=0; 
    if(p.navid&&p.activeclass){this.g=T$$('li',T$(p.navid)); this.s=p.activeclass} 
    s.style.overflow='hidden'; this.a=p.auto||0; this.p=p.resume||0; 
    for(i;i<l;i++){ 
     if(u[i].parentNode==s){ 
      u[i].style.position='absolute'; this.l++; u[i].o=p.visible?100:0; 
      u[i].style.opacity=u[i].o/100; u[i].style.filter='alpha(opacity='+u[i].o+')' 
     } 
    } 
    this.pos(p.position||0,this.a?1:0,p.visible) 
}, 
fade.prototype.auto=function(){ 
    this.u.ai=setInterval(new Function(this.n+'.move(1,1)'),this.a*1000) 
}, 
fade.prototype.move=function(d,a){ 
    var n=this.c+d, i=d==1?n==this.l?0:n:n<0?this.l-1:n; this.pos(i,a) 
}, 
fade.prototype.pos=function(i,a,v){ 
    for(j=0;j<this.u.length;j++){if(j!=this.c && j!=i)this.u[j].style.zIndex=0;} 
    this.u[this.c].style.zIndex=1; 
    var p=this.u[i]; p.style.zIndex=2; 
    clearInterval(p.si); clearInterval(this.u.ai); this.u.ai=0; this.c=i; 
    if(p.o>=100&&!v){p.o=0; p.style.opacity=0; p.style.filter='alpha(opacity=0)'} 
    if(this.g){for(var x=0;x<this.l;x++){this.g[x].className=x==i?this.s:''}} 
    p.si=setInterval(new Function(this.n+'.fade('+i+','+a+')'),20) 
}, 
fade.prototype.fade=function(i,a){ 
    var p=this.u[i]; 
    if(p.o>=100){ 
     clearInterval(p.si); if((a||(this.a&&this.p))&&!this.u.ai){this.auto()} 
    }else{ 
     p.o+=5; p.style.opacity=p.o/100; p.style.filter='alpha(opacity='+p.o+')' 
    } 
}; 
return{fade:fade} 
}();

來源

2012-06-20 Rodney

更換fade.prototype.move功能，下面的代碼

fade.prototype.move=function(d,a) { 
    if($(this).is(":hover") == false) 
     var n=this.c+d, i=d==1?n==this.l?0:n:n<0?this.l-1:n; this.pos(i,a) 
}

來源

2012-06-20 17:58:56

我取代了代碼，但現在沒有幻燈片之間自動進行。 – Rodney

我能夠通過替換代碼的第二行來獲得它的工作：if（$（'＃slides'）。is（'：hover'）== false）我認爲它與某事有關）不是正確的變量來檢查。 – Rodney

是的，你是對的 –

一個建議有人張貼在TinyFader網站：

* 對於那些誰問一個暫停按鈕，下面的代碼添加到「tinyfader.js」

fade.prototype.pause=function(){ clearInterval(this.u.ai); };

替換「;」即在'fade.prototype.fade = function {...};'之後與功能「」再將其粘貼後「」所以你的代碼看起來像...

//code snippet of tinyfader.js 
..., 
fade.prototype.fade=function(i,a){ 
var p=this.u[i]; 
if(p.o>=100) 
{clearInterval(p.si); if((a||(this.a&&this.p))&&!this.u.ai){this.auto()} 
}else{ 
p.o+=5; p.style.opacity=p.o/100; p.style.filter='alpha(opacity='+p.o+')' 
} 
}, 
fade.prototype.pause=function(){ clearInterval(this.u.ai); }; 
//end snippet

*一旦代碼是在地方，你可以通過使用「slideshow.pause調用暫停功能（）'，或'slidingshowname.pause（）'。要再次進行幻燈播放就叫「slideshow.auto（）」。**

你這樣做...嘗試通過jQuery的或只有JavaScript調用圖像懸停暫停功能後...

自己嘗試一下，並提供我們您的經歷...

來源

2012-06-20 19:28:28

我更換fade.prototype.move功能，下面的代碼

fade.prototype.move=function(d,a) {  
    if($("#"+$(this)[0]["n"]).is(":hover") == false) { 
     var n=this.c+d, i=d==1?n==this.l?0:n:n<0?this.l-1:n; this.pos(i,a) 
    } 
},

來源

2014-09-23 20:19:23

在MouseOver上暫停滑塊幻燈片

回答

相關問題