当视频位于视口中心时暂停/播放视频JWPlayer

我试图在每个视频到达视口中心时暂停/播放不同的视频，然后在您从视口中滚动时暂停它们。当视频位于视口中心时暂停/播放视频JWPlayer

我正在使用JWPlayer，但我遇到的问题是暂停页面上的所有其他视频，并保持当前播放的视频在视口中可见。

function onScrollVideo() { 
    updateVideo(); 
} 

function updateVideo() { 

    var windowHeight = $(window).height(), 

    gridTop = 200, 
    gridBottom = 1000; 

    $('.jwplayer').each(function() { 
    var thisTop = $(this).offset().top - $(window).scrollTop(), 
    playerID = $(this).prop('id'); 

    if (thisTop > gridTop && (thisTop + $(this).height()) < gridBottom) { 
    jwplayer(playerID).play(); 

    } else { 
    jwplayer(playerID).on('pause'); 

    } 

    }); 

} 
window.addEventListener('scroll', onScrollVideo, false);

来源

2016-11-03 Bowen

你试过'jwplayer（playerID）.pause（真）'？ – UltrasoundJelly

这里是我讨论在视口中播放html5视频的各种方法的类似问题......但我认为你的问题是使用jwplayer API。 http://stackoverflow.com/questions/21163756/html5-and-javascript-to-play-videos-only-when-visible/40011508#40011508 – UltrasoundJelly

jwplayer(playerID).pause(true);

JSfiddle

来源

2016-11-03 15:02:36 UltrasoundJelly

这里的任何成功？ – UltrasoundJelly

看起来你永远不会进入你的'$（'。jwplayer'）。他们似乎不会再次开始播放https://jsfiddle.net/vv7jbrv6/4/ – Bowen

each（function（）{'循环。 – UltrasoundJelly

当视频位于视口中心时暂停/播放视频JWPlayer

回答

相关问题