jQuery Cycle - 爲尋呼機版本添加縮略圖

Question

我正在使用jQuery Cycle插件和分頁發現here（大約在頁面中間的一半）。

目前，我所有的分頁看起來像簡單的1,2,3,4一個標籤，根據示例。不過，我想改爲製作這些縮略圖。

它看起來像導航div是由插件腳本本身創建的，所以如果我建立自己的縮略圖列表並將它們指定爲導航元素，插件只會將自己的分頁附加到該div。

有人會知道修改此插件允許圖像縮略圖的正確方法嗎？

我的代碼：

$('#frontimageswap') 
    .before('<div id="nav">') 
    .cycle({ 
    fx:  'turnDown', 
    speed: 'fast', 
    timeout: 5000, 
    pager: '#nav' 

}); 

Answer 1

大，終於看到別人使用這真棒插件而不是jCarusel！你想要做的是在這demo解釋。

代碼或多或少是這樣的：

$('#slideshow').before('<ul id="nav">').cycle({ 
    fx:  'turnDown', 
    speed: 'fast', 
    timeout: 0, 
    pager: '#nav', 

    // callback fn that creates a thumbnail to use as pager anchor 
    pagerAnchorBuilder: function(idx, slide) { 
     return '<li><a href="#"><img src="' + slide.src + '" width="50" height="50" /></a></li>'; 
    } 
}); 

它使用的是在週期的每一項運行一次功能pageAnchorBuilder。在這裏您可以訪問當前的幻燈片和idx。你不是在說你的標記或縮略圖是如何製作的，但這應該讓你開始。

注意：我沒有更改設置以匹配您的設置。