jQuery Cycle - 未加載img幻燈片，重新排列幻燈片

Question

我正在使用jQuery Cycle插件來創建一個非常簡單的幻燈片：

標記：

<div class="gallery group">

    <div class="slide-nav">
        <a href="#" class="previous">&laquo; Ver anterior</a>
        <a href="#" class="view">Ver Ficha</a>
        <a href="#" class="next">Ver siguiente &raquo;</a>
    </div><!-- /slide-nav -->

    <div class="slider">

        <div class="slides">
            <img src="img/gallery01.jpg" alt="" />
            <img src="img/gallery02.jpg" alt="" />
            <img src="img/gallery01.jpg" alt="" />
            <img src="img/gallery02.jpg" alt="" />
        </div>

        <div class="thumbs"></div>

    </div><!-- /slider -->

</div><!-- /gallery -->

腳本：

jQuery('.gallery .slider .slides').cycle({ 
    fx:     'fade', 
    speed:  '800', 
    timeout: 3000, 
    prev:   '.gallery .slide-nav a.previous',
    next:   '.gallery .slide-nav a.next',
    pager:  '.gallery .slider .thumbs',

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

pagerAnchorBuilder是在pager中創建縮略圖的功能（在我的示例中為.thumbs ）。 想法是縮略圖是在.thumbs中創建的.slides是幻燈片的包裝器（在我的例子中是圖像）。

但是，我在控制台的日志中得到這個（不是錯誤或警告，只是日志）：

[循環] 1 - img幻燈片未加載，重新排列幻燈片：gallery01.jpg 0 0

幻燈片仍然有效，但它不會創建縮略圖，告訴我來自pagerAnchorBuilder函數的img變量未定義。

知道什么是“重新排列幻燈片”意味着什么以及圖像未定義的原因？ 我過去曾多次使用過這個精確的片段，之前從未遇到過這個問題。

Answer 1

嗯......

    var img = jQuery(slide).find("img").attr("src");

如果傳入“pagerAnchorBuilder”回調的“幻燈片”將是“幻燈片” <div>中的<img>元素之一，那么您不需要“find（）”。 它應該只是：

    var img = jQuery(slide).attr('src');

或者，更簡單：

    var img = slide.src;

“.find（）”方法永遠不會包含起始元素; 它只關注DOM中的后代。