jquery video全屏_请问,怎么用JQuery监听html5 中video 标签的全屏按钮?
时间: 2023-06-28 10:08:12 浏览: 140
html5自定义video标签的海报与播放按钮功能
可以使用以下代码来监听video标签的全屏按钮:
```javascript
$('video').bind('webkitfullscreenchange mozfullscreenchange fullscreenchange', function(e) {
var state = document.fullScreen || document.mozFullScreen || document.webkitIsFullScreen;
var event = state ? 'FullscreenOn' : 'FullscreenOff';
// 触发自定义事件
$(this).trigger(event);
});
```
这段代码监听了三种全屏事件,分别是webkitfullscreenchange、mozfullscreenchange和fullscreenchange。当任意一个事件触发时,会获取当前的全屏状态,并根据状态触发自定义的FullscreenOn或FullscreenOff事件。
你可以在FullscreenOn或FullscreenOff事件的回调函数中执行你需要的操作。
阅读全文