html5全屏视频onClick事件 [英] html5 fullscreen video onClick event

问题描述

有没有办法让图片触发全屏html5视频？基本上我有这样的东西：

Is there a way to make a image fire a fullscreen html5 video? Basically I have something like this:

           <div class="slide" id="">
               <img src="../root/img/gc_small.png" id="videoPlay" style="margin:200px 0 0 0;">
                <video autoplay loop muted controls="false" id="myVideo">
                    <source src="video/portal.mp4" type="video/mp4">
                </video>
            </div>

所以我想隐藏#myVideo并向#videoButton添加点击事件来拍摄视频进入完整的浏览器屏幕这可能吗？

So I was thinking of hiding the #myVideo and adding a click event to #videoButton to take the video into full browser screen. Is this possible??

推荐答案

$(function() {
    $(SELECTOR).on('click', function(event) {
        event.preventDefault();
        $(VIDEO SELECTOR).requestFullscreen();
    });
});

这篇关于html5全屏视频onClick事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！