2011-11-12 52 views
2

我想用jQuery Cycle插件構建一個幻燈片,我已經做過,但現在我想要一個高級滑塊。 滑塊需要在淡入淡出和下一張幻燈片的上滾之間進行延遲,以便進行上卷和淡出;jQuery Cycle插件高級滑塊

這是我的代碼SOFAR

$.fn.cycle.transitions.customSlide = function($cont, $slides, opts) { 
opts.fxFn = function(curr, next, opts, after) { 
    $(curr).hide(function() { 
    $(next).delay(opts.delayBetween).show(function() { 
    after();    
    }); 
    }); 
}; 
}; 

$('#slideshow2').cycle({ 
fx: "customSlide", 
delay: 3500, 
timeout: 2000, 
delayBetween: 1000 
}); 

上面的代碼應該只是顯示和隱藏的對象;我怎麼才能使它工作,因此它滑落,並淡出?

回答

0

我不確定你是否希望在自定義函數中專門使用這個函數,但這裏只是一個使用內置循環屬性的版本。 animOut是神奇的地方提供slideUp和fadeOut功能的地方。希望這可以幫助。

$('#slideshow').cycle({ 
     fx: 'custom', 
     cssBefore: { 
       left: 0, 
       top: 0, 
       width: 0, 
       height: 0, 
       opacity: 1, 
       display: 'block' 
     }, 
     animOut: { 
       opacity: 0, 
       top: -50 
     }, 
     animIn: { 
       left: 0, 
       top: 0, 
       width: 200, 
       height: 200 
     }, 
     cssAfter: { 
       zIndex: 0 
     }, 
     delay: -3000 
    });     
+0

嗨喬希,謝謝你的評論。這不是我正在尋找的。雖然我正在尋找一種在幻燈片之間暫停的方法,但動畫是正確的。 –