Question

我的html中有一个图片滑块元素，如下所示：

＆＃xA;＆＃xA;

 ＆lt; div class =“slider”＆gt;＆＃xA; ＆LT; IMG /＆GT;＆＃XA; ＆LT; IMG /＆GT;＆＃XA; ＆lt; iframe src =“https://player.vimeo.com/video/”＆lt; / iframe＆gt;＆＃xA; ＆LT; IMG /＆GT;＆＃XA; ＆lt; / div＆gt;＆＃xA;

＆＃xA;＆＃xA;

使用iframe视频。目前它继续在后台播放。我想在使用next / prev导航图标（.next和.prev）导航时停止/刷新视频。

＆＃xA;＆＃xA;

我怎样才能做到最好？

＆＃xA;

Answer 1

您必须使用video代替iframe：

<video controls>
<source src="Your Path" type="video/mp4">
Your browser does not support the video tag.
</video>

Working jsfiddle here

Answer 2

我在这里使用了这个问题的jquery：Stop all playing iframe videos on click a link javascript

    <script language="javascript" type="text/javascript" src="jquery-1.8.2.js"></script>
        <script language="javascript" type="text/javascript">
        $(function(){
            $('.next , .prev').click(function(){      
                $('iframe').attr('src', $('iframe').attr('src'));
            });
        });
        </script>

我尝试使用html5视频，但是我在使用vimeo url作为源时遇到了问题。

点击导航图标停止/重置<iframe>视频

2 个答案: