2014-09-21 83 views
1

我有3個「主要」幻燈片。有在每個「主」幻燈片之間的「中間」滑動和我希望我可以實現在適當的按鈕按點擊下述效果如何轉到2張幻燈片

("go to slide 1", "go to slide 2","go to slide 3") 

當用戶單擊Button (「去滑動1 「)

1)$('.cycle-slideshow').cycle('goto', intermediate slide);

2)執行任務(我需要一箇中間滑動圖像以創建有效的變焦)

2)$('.cycle-slideshow').cycle('goto', 1);

ans等......

預先感謝您的幫助。

回答

1

也許嘗試這樣的事情。我沒有測試過它。但是你想用高級的cycle2 api編寫你自己的goto(跳轉)處理程序,按照這個頁面:​​。

這裏的默認跳轉功能(搜索跳轉:功能):https://github.com/malsup/cycle2/blob/45fde557e8fb4c2d59a9667ba744b63a0da9916c/build/jquery.cycle2.js

因此,這裏是它們的功能的修改版本(不再次測試!):

$('.cycle-slideshow').on('cycle-bootstrap', function (e, optionHash, API) { 
    // replace "jump (goto)" method with custom implementation. 
    // This next part is the same as the original 
    API.jump = function (index, fx) { 
     var fwd; 
     var opts = this.opts(); 
     if (opts.busy && !opts.manualTrump) 
      return; 
     var num = parseInt(index, 10); 
     if (isNaN(num) || num < 0 || num >= opts.slides.length) { 
      opts.API.log('goto: invalid slide index: ' + num); 
      return; 
     } 
     if (num == opts.currSlide) { 
      opts.API.log('goto: skipping, already on slide', num); 
      return; 
     } 

     // put the remaining code in a function so you can call it twice 
     function jump_inner(num) { 
      opts.nextSlide = num; 
      clearTimeout(opts.timeoutId); 
      opts.timeoutId = 0; 
      opts.API.log('goto: ', num, ' (zero-index)'); 
      fwd = opts.currSlide < opts.nextSlide; 
      opts._tempFx = fx; 
      opts.API.prepareTx(true, fwd); 
     } 

     // figure out the intermediate slide. i'm just guessing on how you want to do this. change the logic to whatever you need, or maybe the intermediate slide is the same for each button. 
     var intermediate; 
     switch (num) { 
      case '1': 
       intermediate = 4; 
       break; 
      case '2': 
       intermediate = 5; 
       break; 
      case '3': 
       intermediate = 6; 
       break; 
     } 

     // first do the intermediate. 
     jump_inner(intermediate); 

     // use setTimeout to wait some time then do the next slide 
     setTimeout("jump_inner(num);", 2000); 
    } 
}); 
+0

感謝manishie。我今晚會嘗試並報告。 – 2014-09-23 19:50:40

+0

It Works!現在我需要弄清楚如何在中間頁面顯示時使用創建縮放效果。再次感謝! – 2014-09-24 02:08:45

相關問題