Hello! There is a carousel link to fiddle How to make an infinite scrolling, i.e. Immediately after the last slide was the first? Just loop:true
does not work ..
$(document).ready(function() { $("#owl-demo").owlCarousel({ navigation: true, pagination: true, lazyLoad: true, loop: true }); });
#owl-demo .owl-item > div img { display: block; width: 100%; height: auto; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; margin-bottom: 4px; } #owl-demo .owl-item > div { padding: 0px 2px }
<div id="owl-demo" class="owl-carousel"> <div> <img class='lazyOwl' data-src="http://placehold.it/200x200/42bdc2/FFFFFF&text=1st Row" alt="" /> <img class='lazyOwl' data-src="http://placehold.it/200x200/42bdc2/FFFFFF&text=2nd Row" alt="" /> </div> <div> <img class='lazyOwl' data-src="http://placehold.it/200x200/42bdc2/FFFFFF&text=1st Row" alt="" /> <img class='lazyOwl' data-src="http://placehold.it/200x200/42bdc2/FFFFFF&text=2nd Row" alt="" /> </div> <div> <img class='lazyOwl' data-src="http://placehold.it/200x200/42bdc2/FFFFFF&text=1st Row" alt="" /> <img class='lazyOwl' data-src="http://placehold.it/200x200/42bdc2/FFFFFF&text=2nd Row" alt="" /> </div> <div> <img class='lazyOwl' data-src="http://placehold.it/200x200/42bdc2/FFFFFF&text=1st Row" alt="" /> <img class='lazyOwl' data-src="http://placehold.it/200x200/42bdc2/FFFFFF&text=2nd Row" alt="" /> </div> <div> <img class='lazyOwl' data-src="http://placehold.it/200x200/42bdc2/FFFFFF&text=1st Row" alt="" /> <img class='lazyOwl' data-src="http://placehold.it/200x200/42bdc2/FFFFFF&text=2nd Row" alt="" /> </div> <div> <img src="http://placehold.it/200x200/42bdc2/FFFFFF&text=1st Row" alt="" /> <img src="http://placehold.it/200x200/42bdc2/FFFFFF&text=2nd Row" alt="" /> </div> <div> <img src="http://placehold.it/200x200/42bdc2/FFFFFF&text=1st Row" alt="" /> <img src="http://placehold.it/200x200/42bdc2/FFFFFF&text=2nd Row" alt="" /> </div> </div>