如何在Slick Slider中使用mediaelement.js自动播放和自动暂停视频

时间:2018-07-31 07:33:30

标签: jquery

只有当我的滑块中有单个视频时,下面的代码才起作用。但是我的滑块中有多个视频。

我的光滑滑块js:

$('.video_full').slick({ 
    slidesToShow: 1,
    slidesToScroll: 1,
    arrows: false,
    fade: true,
    asNavFor: '.videos',
    autoplay: true,
    autoplaySpeed: 3000 
});

$('.videos').slick({
    slidesToShow: 1,
    slidesToScroll: 1,
    asNavFor: '.video_full',
    dots: false,
    centerMode: false,
    focusOnSelect: true,
    vertical: false,
    arrows: false
});

$('.video_full').on('afterChange', function(event, slick, currentSlide) {
    if (currentSlide == 1) {
        $('.video_full').slick('slickPause');
        $('#theVideo').get(0).play();
    }
});

document.getElementById('theVideo').addEventListener('ended', myHandler, false);

function myHandler(e) {
    $('.video_full').slick('slickPlay');
}

1 个答案:

答案 0 :(得分:0)

您可以使用J播放器。从那里您可以自定义按钮。