Owl Karussell 2: Fauler Last für Videos

Question

Ich habe ein Karussell von Owl Karussell v2 mit faul Last angetrieben aktiviert:

JS:

$('.owl-carousel').owlCarousel({ 
    lazyLoad: true 
}); 

HTML:

<div class="owl-carousel"> 
    <div> 
    <img class="owl-lazy" data-src="..."> 
    </div> 
</div> 

die funktioniert OK . Dann habe ich versucht, den gleichen Code auf die HTML5-Video-Tags anzuwenden, die ich habe:

, die nicht funktioniert haben. Irgendwelche Ideen, wie man es für Videos auch aktiviert?

Answer 1

Wenn jemand auf der anderen gleichen Ausgabe kam, die Lösung, die ich mit unten kam ist:

// Lazy load for videos 
var modalSlider = $('.owl-carousel'); 

modalSlider.on('changed.owl.carousel', function(event) { 
    var current = event.item.index; 
    var currentVideo = $(event.target).find('.owl-item').eq(current).find('video'); 
    var currentVideoSource = currentVideo.find('source'); 

    // Pause all videos 
    var videos = modalSlider.find('video'); 

    if (videos.length) { 
    videos.each(function() { 
     $(this)[0].pause(); 
    }); 
    } 

    // Play if video found 
    if (currentVideo.length) { 
    var currentVideoSrc = currentVideoSource.attr('data-src'); 
    currentVideoSource.attr('src', currentVideoSrc); 
    currentVideo[0].load(); 
    currentVideo[0].play(); 
    } 
});