jQuery-Cycle：如何更改每個新圖像的過渡效果

Question

這幾乎是我想要完成的。讓每個圖像都以不同的過渡效果出現。

你能幫我解決並找出我的代碼有什麼問題嗎？

的jQuery：

var url = 'http://www.mywebsite.com/'; 
var img_dir = '_img/slideshow/'; 
var fx = 
    [ 
    'blindX', 
    'blindY', 
    'blindZ', 
    'cover', 
    'curtainX', 
    'curtainY', 
    'fade', 
    'fadeZoom', 
    'growX', 
    'growY', 
    'scrollUp', 
    'scrollDown', 
    'scrollLeft', 
    'scrollRight', 
    'scrollHorz', 
    'scrollVert', 
    'shuffle', 
    'slideX', 
    'slideY', 
    'toss', 
    'turnUp', 
    'turnDown', 
    'turnLeft', 
    'turnRight', 
    'uncover', 
    'wipe', 
    'zoom' 
    ]; 
var index = 0; 

$(function() { 
    var $slideshow = $('#slideshow'); 
    // add slides to slideshow (images 2-3) 
    for (var i = 2; i < 13; i++) 
     $slideshow.append(
      '<a href="' + url + img_dir + i+'.jpg" title="Slideshow">'+ 
       //src="http://www.mywebsite.com/_img/slideshow/" 
      '<img src="' + url + img_dir + i+'.jpg" width="100" height="100" />'+ 
      '</a>'); 
    // start the slideshow 
    $slideshow.cycle(
    { 
     if(index < fx.length) { index++; } 
     else { index = 0; } 
     fx:  fx[index], 
     timeout: 3000 
    }); 
}); 

Answer 1

要使用所有的效果那是相當容易：

http://jsfiddle.net/lucuma/tcRCj/14/

$('#slideshow').cycle({fx:'all'});​ 

此外，如果你只是想指定某幾個：

$('#slideshow').cycle({fx:'scrollDown,scrollLeft,fade'}); 

如果你不想隨機效果的順序（默認情況下將隨機）：

$('#slideshow').cycle({fx:'scrollDown,scrollLeft,fade', randomizeEffects:0});