HTML5 视频在关闭时停止

发布于 2024-09-02 04:56:34 字数 316 浏览 4 评论 0原文

我正在使用 jQuery 工具进行叠加。在覆盖层内我有一个 HTML5 视频。但是，当我关闭叠加层时，视频会继续播放。知道如何在关闭叠加层时让视频停止吗？这是我的代码：

$("img[rel]").overlay({ onClose: function() { <stop the video somehow> }, mask: { color: '#000', opacity: 0.7 }});

我尝试使用

$('video').pause();

但这也暂停了覆盖。

原文

I'm using jQuery tools for an overlay. Inside the overlay I have an HTML5 video. However, when I close the overlay, the video keeps playing. Any idea how I might get the video to stop when I close the overlay? Here's the code I have:

$("img[rel]").overlay({ onClose: function() { <stop the video somehow> }, mask: { color: '#000', opacity: 0.7 }});

I tried using

$('video').pause();

But this paused the overlay as well.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

来日方长 2024-09-09 04:56:34

如果您想停止页面中的每个电影标签播放，这个 jQuery 的小片段将帮助您：

$("video").each(function () { this.pause() });

If you want to stop every movie tag in your page from playing, this little snippet of jQuery will help you:

$("video").each(function () { this.pause() });

回复收藏 0 原文

纸短情长 2024-09-09 04:56:34

使用不同浏览器启动视频

对于 Opera 12

window.navigator.getUserMedia(param, function(stream) {
                            video.src =window.URL.createObjectURL(stream);
                        }, videoError );

对于 Firefox Nightly 18.0

window.navigator.mozGetUserMedia(param, function(stream) {
                            video.mozSrcObject = stream;
                        }, videoError );

对于 Chrome 22

window.navigator.webkitGetUserMedia(param, function(stream) {
                            video.src =window.webkitURL.createObjectURL(stream);
                        },  videoError );

使用不同浏览器停止视频

对于 Opera 12

video.pause();
video.src=null;

对于 Firefox Nightly 18.0

video.pause();
video.mozSrcObject=null;

对于 Chrome 22

video.pause();
video.src="";

Starting Video with different browsers

For Opera 12

window.navigator.getUserMedia(param, function(stream) {
                            video.src =window.URL.createObjectURL(stream);
                        }, videoError );

For Firefox Nightly 18.0

window.navigator.mozGetUserMedia(param, function(stream) {
                            video.mozSrcObject = stream;
                        }, videoError );

For Chrome 22

window.navigator.webkitGetUserMedia(param, function(stream) {
                            video.src =window.webkitURL.createObjectURL(stream);
                        },  videoError );

Stopping video with different browsers

For Opera 12

video.pause();
video.src=null;

For Firefox Nightly 18.0

video.pause();
video.mozSrcObject=null;

For Chrome 22

video.pause();
video.src="";

回复收藏 0 原文

萧瑟寒风 2024-09-09 04:56:34

以下对我有用：

$('video')[0].pause();

The following works for me:

$('video')[0].pause();

回复收藏 0 原文

凉城凉梦凉人心 2024-09-09 04:56:34

问题可能出在您选择的 jquery 选择器上
$("video") 不是选择器

右侧选择器可能会为 video 标签放置 id 元素，即
假设您的视频元素如下所示：

<video id="vid1" width="480" height="267" oster="example.jpg" durationHint="33"> 
    <source src="video1.ogv" /> 
    <source src="video2.ogv" /> 
</video>

然后您可以通过 $("#vid1") 使用井号 (#)、jquery 中的 id 选择器来选择它。
如果视频元素在函数中公开，那么您可以访问 HtmlVideoElement (HtmlMediaElement)。此元素可以控制视频元素，在您的情况下，您可以使用 pause()视频元素的方法。

此处查看 VideoElement 的参考。
另请检查此处是否有后备参考。

The problem may be with jquery selector you've chosen
$("video") is not a selector

The right selector may be putting an id element for video tag i.e.
Let's say your video element looks like this:

<video id="vid1" width="480" height="267" oster="example.jpg" durationHint="33"> 
    <source src="video1.ogv" /> 
    <source src="video2.ogv" /> 
</video>

Then you can select it via $("#vid1") with hash mark (#), id selector in jquery.
If a video element is exposed in function,then you have access to HtmlVideoElement (HtmlMediaElement).This elements has control over video element,in your case you can use pause() method for your video element.

Check reference for VideoElement here.
Also check that there is a fallback reference here.

回复收藏 0 原文

淡淡的优雅 2024-09-09 04:56:34

有人已经有了答案。

$('video') 将返回视频项数组。这是一个完全有效的选择器！

所以

$("video").each(function () { this.pause() });

会起作用。

Someone already has the answer.

$('video') will return an array of video items. It is totally a valid seletor!

$("video").each(function () { this.pause() });

will work.

回复收藏 0 原文

浮光之海 2024-09-09 04:56:34

对于 JQM+PhoneGap 应用程序，以下内容对我有用。

以下是我要让它发挥作用的最低要求。实际上，当用户按下后退按钮时，由于在生成 ajax 请求时进行缓冲，我遇到了停顿。在 Chrome 和 Android 浏览器中暂停视频会使其保持缓冲状态。非异步 ajax 请求会卡住等待缓冲完成，但它永远不会。

将其绑定到 beforepagehide 事件修复了它。

 $("#SOME_JQM_PAGE").live("pagebeforehide", function(event)
 {
           $("video").each(function () 
           { 
               logger.debug("PAUSE VIDEO");
               this.pause();
               this.src = "";
           });
 });

这将清除页面上的每个视频标签。

重要的部分是 this.src = "";

For a JQM+PhoneGap app the following worked for me.

The following was the minimum I had to go to get this to work. I was actually experiencing a stall due to the buffering while spawning ajax requests when the user pressed the back button. Pausing the video in Chrome and the Android browser kept it buffering. The non-async ajax request would get stuck waiting for the buffering to finish, which it never would.

Binding this to the beforepagehide event fixed it.

 $("#SOME_JQM_PAGE").live("pagebeforehide", function(event)
 {
           $("video").each(function () 
           { 
               logger.debug("PAUSE VIDEO");
               this.pause();
               this.src = "";
           });
 });

This will clear every video tag on the page.

The important part is this.src = "";

回复收藏 0 原文

(り薆情海 2024-09-09 04:56:34

我使用 Firefox 的经验是，向视频元素添加“id”属性会导致 Firefox 完全崩溃......就像要求您提交错误报告一样。删除 id 元素即可正常工作。我不确定这是否适用于每个人，但我想我会分享我的经验，以防有帮助。

回复收藏 0 原文

顾铮苏瑾 2024-09-09 04:56:34

为了节省数小时的编码时间，请使用已针对嵌入式视频 iframe 进行优化的 jquery 插件。

我花了几天时间尝试将 Vimeo 的 moogaloop API 与 jquery 工具集成，但没有成功。请参阅此列表了解一些更简单的选项。

回复收藏 0 原文

回忆那么伤 2024-09-09 04:56:34

试试这个：

if ($.browser.msie)
{
   // Some other solution as applies to whatever IE compatible video player used.
}
else
{
   $('video')[0].pause();
}

但是，考虑到 $.browser 已被弃用，但我还没有找到类似的解决方案。

Try this:

if ($.browser.msie)
{
   // Some other solution as applies to whatever IE compatible video player used.
}
else
{
   $('video')[0].pause();
}

But, consider that $.browser is deprecated, but I haven't found a comparable solution.

回复收藏 0 原文

~没有更多了~

关于作者

指尖上的星空

暂无简介

0 文章

0 评论

21 人气

关注发私信

友情链接

文江博客

HTML5 视频在关闭时停止

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

评论（9）

关于作者

相关话题

热门标签

推荐作者

qq_FjTq5B

18273202778

WordPress小学生

〃温暖了心ぐ

迷乱花海

niuniu

友情链接

HTML5 视频在关闭时停止

如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

评论（9）

关于作者

相关话题

热门标签

推荐作者

qq_FjTq5B

18273202778

WordPress小学生

〃温暖了心ぐ

迷乱花海

niuniu

友情链接

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。