Question

我正在使用skrollr面对这个问题：一切顺利，然后在添加视频时，如果超出视口，它会继续播放，即使div有display：none声明。我试着在这里和谷歌搜索但找不到任何东西，此时我真的迷路了。

供参考，这是我正在使用的代码：

<div id="seventh" class="view" data-0="display:none;top:0%;" data-27000="display:block;opacity:0;" data-29000="opacity:1;" data-32000="opacity:0;" >

<video id="video" class="video-js vjs-default-skin" controls preload="none" width="1223" height="611" poster="img/poster.jpg" data-setup="{}">
<source src="videos/vid.webm" type='video/webm' />
<source src="videos/vid.mp4" type='video/mp4' />

</video>

</div>

如何实现这一点的任何帮助真的很感激

Answer 1

使用

skrollr.init({
    render: function(data) {
        //get current element opacity and position then play or pause the video
    }
});

有关工作示例，请参阅http://jsfiddle.net/ybP6b/

如何在视口外停止播放html5视频？

1 个答案: