Question

我有一个jquery循环滑块，当播放视频或到达显示视频的幻灯片时，我需要暂停。（这些选项中的任何一个都没问题，但我无法弄清楚如何暂停具有某个类或ID的幻灯片。）我正在使用video.js来显示视频。

当我按下播放视频开始播放时，会发生什么事情，但当我将鼠标移开视频时，它会自动转到下一张幻灯片。如果我点击寻呼机缩略图它会暂停，但如果幻灯片正常进行并按下播放，它将遵循循环'超时'设置的规则。

我正在寻找的是一种在播放视频时暂停幻灯片放映的方法 - 通过在视频开始播放时调用事件，或者在到达视频幻灯片时完全暂停幻灯片放映。

我头脑中有这个：

<script>
    jQuery(document).ready(function($) {    
        $(".project_slides").cycle({
        fx:'fade',
            timeout: 5000,
            prev : '#prev',
            next : '#next',
            pager : '#pager',
            pause: 1,
            pagerAnchorBuilder: function(idx, slide) {
                return '#pager li:eq(' + (idx) + ') a';
            }
        });

        $('#pager a').click(function() { 
            $('.project_slides').cycle('pause'); 
        });

        function pauseitall() {
            $('.project_slides').cycle('pause');
        }   
    });

</script>

在身体里：

<div class="project_slides">
    <div class="slide">
        <img src="/media/{{ Slide.media }}" alt="{{ Slide.caption }}" />
    </div>

    <div class="slide">
        <video id="video_11" 
            class="video-js vjs-default-skin" 
            controls width="512" 
            height="406" 
            poster="/media/images/video-poster.png" 
            preload="auto" loop>
            <source type="video/mp4" src="/media/{{ Slide.media }}">
        </video>

        <script>
            $(function() {
                _V_("video_11").ready(function() {
                var myPlayer = this;
                addEvent(myPlayer.video, "play", function () {
                    pauseitall()}, false);
                    myPlayer.play();
                });
            });
        </script>
    </div>
</div>

显然，pauseitall（）函数没有被正确调用，但是我一直在努力解决这个问题（在很多次迭代中），我最后只是想在这里发布它，看看是否有人知道解决方案。 / p>

供参考，使用jQuery 1.7.2，jquery循环2.9999.5和Video.js 3.2.0

Answer 1

试试这个：

myPlayer.addEvent("play", pauseitall);

this is how the docs指定如何绑定到事件

使用Video.js暂停jQuery循环

1 个答案: