video1 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style type="text/css">
            .div2{
                width: 600px;
                height: 300px;
                background: skyblue;
            }
        </style>
    </head>
    <body>
        <video width="800" height="" src="img/shiping.mp4" poster="img/timg.jpg" controls="controls"></video>
        
        <button>播放</button>
        <button class="fullscreen">全屏</button>
        
        
        
        <img src="img/timg.jpg"/>
        
        
        <div class="div2">
            <h1>helloworld</h1>
        </div>
        <script type="text/javascript">
        var v1 = document.querySelector('video')
            document.querySelector('button').onclick = function(){
                v1.play()
            }
            
            
            document.querySelector('.fullscreen').onclick = function(){
                v1.webkitRequestFullScreen()
            }
            
            document.querySelector('img').onclick  = function(){
                document.querySelector('img').webkitRequestFullScreen()
            }
            
            
            document.querySelector('.div2').onclick = function(){
                document.querySelector('.div2').webkitRequestFullScreen()
            }
            
        </script>
        
    </body>
</html>

 

posted @ 2019-03-18 21:56  就这样子吧  阅读(157)  评论(0)    收藏  举报