0

I have below code for jQuery owl carousel slider.

jQuery('#testslider').owlCarousel({
                lazyLoad:true,
                loop: true,
                nav:true,
                dots:false,
                margin:0,
                autoplay:true,
                autoplayTimeout:6000,
                autoplayHoverPause:true,
               responsiveClass:true,
                responsive:{
                    0:{
                        items:1,
                        nav:true
                    },
                    768:{
                        items:3,
                        nav:true
                    },
                    1250:{
                        items:5,
                        nav:true
                    },
                    1800:{
                        items:6,
                        nav:true
                    }
                }
        });

But when there are only 2 items only first items image is loaded.

Bellow is code:-

<div id="testslider">
            <?php foreach ($col as $c): 
                        <div class="item">
                                    <img class="owl-lazy" data-src="<?php echo $imgSrc; ?>" alt="<?php echo $c->getName() ?>" title="<?php echo $c->getName() ?>" />
                        </div>
                <?php endforeach; ?> 
</div>
  • can you show your html – Priyank Dec 27 '17 at 10:22
  • where is this $imgSrc ? – Priyank Dec 27 '17 at 10:34
  • $imgSrc is dynamic path i get and i checked it is getting proper. @priyank – Denish Vachhani Dec 27 '17 at 11:08
0

Shouldn't be div "items" in

div class="item"

Or dynamic PHP load of end of this class

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.