JQuery Cycle - img slide not loaded, resale slideshow

I use the jQuery Cycle plugin to create a very simple slideshow:

Markup:

<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 -->

Script:

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>';
    } 
});

pagerAnchorBuilderis a function that creates thumbnails in pager( .thumbsin my example). The idea is that thumbnails are created in .thumbs, and .slidesthis is a shell for slides (images in my case).

However, I get this when I enter the console (not an error or warning, just a log):

[cycle] 1 - slide img not loaded, resale slideshow: gallery01.jpg 0 0

The slideshow still works, but it does not create thumbnails, telling me that the variable imgfrom the function is pagerAnchorBuilderundefined.

, " -" undefined? .

+3
1

...

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

"", "pagerAnchorBuilder", <img> "" <div>, "find()". :

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

, :

    var img = slide.src;

".find()" ; DOM.

+2

Source: https://habr.com/ru/post/1795262/


All Articles