如何解决在 Drupal 7 中单击下一个按钮时停止播放当前视频
我正在使用 drupal 7 版本创建“幻灯片”来显示视频的幻灯片,每个视频都嵌入到自己的内容项中。
当用户开始播放视频时,如果视频还在播放,点击“下一步”,幻灯片会前进到下一张幻灯片,但上一张幻灯片的视频不会停止播放(所有浏览器)。然后,用户可以点击播放下一个视频,然后两个视频将同时播放。如果用户前进到下一张幻灯片,他们可以开始播放第三个同步视频,依此类推。当用户点击“下一步”转到下一张幻灯片时,我想停止当前正在播放的任何视频。
有人可以提供一些简单的代码来防止不同幻灯片上的多个视频同时播放吗?
这是我的视频 HTML 代码:
<video class="video-test" style="width:96%;padding-left:6%;" controls>
<source src="./sites/default/files/MyGovUC 2 0.mp4" type="video/mp4">
</video>
我曾尝试使用下面的 js 但不起作用。
$('.video_test').on('afterChange',function(event,slick,currentSlide,nextSlide) {
player.pause();
});
我的前端结果如下图所示:
感谢您的帮助。
解决方法
您希望 afterChange
事件在 slide 更改(不是视频)时触发您的处理程序,因此您需要选择 slick 元素。然后在处理程序中,您可以暂停所有(或仅那些与您的选择器匹配的)视频:
$('#<slick_id>').on('afterChange',function() {
$('.video_test').each(function() {
this.pause();
});
});
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。