用jQueryCycle循環播放多個幻燈片

我使用jQueryCycle腳本處理幻燈片時出現問題。該幻燈片由五個滑塊組成：一個是圖像水平移動的大滑塊，另一個是上下滑動的四個小滑塊。每當主幻燈片轉換到下一張幻燈片時，垂直幻燈片將全部轉換並相互同步移動，小幻燈片圖像與主幻燈片匹配。用jQueryCycle循環播放多個幻燈片

當我嘗試向我的垂直幻燈片添加某個功能時，我的問題就會出現。當用戶點擊頂部垂直幻燈片時，我希望幻燈片順利過渡到下一張幻燈片三次，因此用戶點擊的圖像現在是底部幻燈片和主幻燈片。

for (var i=0; i < 3; i++) { 
setTimeout(function() { 
    $('#slides').cycle('next'); 
    $('#slideh1').cycle('next'); 
    $('#slideh2').cycle('next'); 
    $('#slideh3').cycle('next'); 
    $('#slideh4').cycle('next'); 
}, 2000); 
}

當我測試這在頂部垂直滑動，它跳到選定的幻燈片，只示出了一個單一的滑過渡，而不是三個之前等待兩秒鐘。我不知道我的邏輯是否存在缺陷，或者如果我沒有正確使用setTimeout函數，但任何幫助都將不勝感激！

完整的測試代碼可以找到here。

來源

2012-11-21 Drew02

我一直在想這個錯誤的方式。 jQuery Cycle中的幻燈片循環似乎不是您可以重複使用的函數，除非您使用after回調。

jQuery('#slides').cycle({ 
    fx:  transitionMain 
    ,autostop: autoS 
    ,speed: delayMain 
    ,delay: -'0' 
    ,timeout: timeO 
    //,pause: '0' 
    ,continuous: isContinuous 
    ,easeIn: eas 
    ,easeOut: eas 
    ,speedIn: transitionSpeed 
    ,speedOut: transitionSpeed 
    ,synch: 'true' 
    ,after: mainSlideNum 
    ,startingSlide: mainStartSlide 
    });

對於我的主要幻燈片，我稱之爲mainSlideNum功能我的回調之後。

function mainSlideNum(curr,next,opts) { 
    var totalSlides = opts.slideCount; 
    if (opts.currSlide == 0) { 
    cSlideMain = (totalSlides) 
     } else { 
     cSlideMain = opts.currSlide; } 
    $('#slides').attr('curSlideNumber', cSlideMain); 

    //If vertical slides are clicked, checks to see if the clicked slide matches the current slide. Continues to cycle until it matches. 
    if (clickedSlide != cSlideMain && clickedSlide != null) { 
     nextSlide(); 
     } 
    if (clickedSlide == cSlideMain) { //ends the slide cycling 
     clickedSlide = null; 
    initializeValues(); 
    changeSlideOptions(); 
     } 
    }

可變clickedSlide指的是用於垂直滾動滑動點擊的幻燈片編號，和包含cSlideMain正在顯示的幻燈片的幻燈片編號。該功能繼續循環到下一張幻燈片，直到兩個數字匹配。

來源

2012-12-13 16:08:14 Drew02

用jQueryCycle循環播放多個幻燈片

回答

相關問題