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

【问题标题】：Pause/play video when video is in the center of the viewport JWPlayer当视频位于视口中心时暂停/播放视频 JWPlayer
【发布时间】：2016-11-03 14:32:32
【问题描述】：

我正在尝试在每个视频到达视口中心时暂停/播放不同的视频，然后在您滚动离开它们时暂停它们。

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

https://jsfiddle.net/vv7jbrv6/1/

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);

【问题讨论】：

你试过jwplayer(playerID).pause(true)吗？
这是我的类似问题，讨论了在视口中播放 html5 视频的各种方法......但我认为你的问题出在 jwplayer API 上。 stackoverflow.com/questions/21163756/…

标签： jquery scroll viewport jwplayer playback

【解决方案1】：

  jwplayer(playerID).pause(true);

JSfiddle

【讨论】：

这里成功了吗？
一旦你向上滚动到它们jsfiddle.net/vv7jbrv6/4，它们似乎就不再开始播放了
看起来你永远不会进入你的 $('.jwplayer').each(function() { 循环。