Расширенный плагин jQuery Cycle plugin - PullRequest
Новая
       7

Расширенный плагин jQuery Cycle plugin

2 голосов
/ 12 ноября 2011

Я хочу создать слайд-шоу с помощью плагина jQuery Cycle, я делал это раньше, но теперь я хочу продвинутый слайдер. Ползунок должен scrollUp и fadeOut с задержкой между fadeOut и scrollUp от следующего слайда;

Это мой код, софар 

$.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
});

Код выше должен просто показать и скрыть объект; как я могу заставить это работать так, чтобы это скользило, и исчезало?

1 Ответ

0 голосов
/ 17 ноября 2011

Я не уверен, что вы хотели именно это в пользовательской функции, но вот версия, использующая только встроенные свойства цикла. В 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 
    });
...