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

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/