首页 > 代码库 > 鼠标移入视频播放,鼠标移出播放停止,恢复到原来状态

鼠标移入视频播放,鼠标移出播放停止,恢复到原来状态

<!doctype html><html lang="en"><head>    <meta charset="UTF-8">    <title>鼠标移入视频播放,鼠标移出播放停止,恢复到原来状态</title>    <link rel="shortcut icon" href="http://files.cnblogs.com/files/heyiming/logo.ico" />    <style>        *{            margin: 0;            padding: 0;        }        .video{            width: 200px;            height: auto;            margin: 0 auto;        }        #video{            width: 200px;            height: auto;        }    </style></head><body>        <div class="video">            <div class="img"  onm ouseover="come()"><img src="demo.png" alt=""/></div>            <a href="此处填写你想要跳转的地址">                 <video id="video"  style="display: none"  src="videos/demo.mp4" autoplay="autoplay"   onm ouseout="go()" ></video>            </a>        </div></body></html><script src="http://files.cnblogs.com/files/heyiming/jquery-2.1.4.min.js"></script><script>    myVid=document.getElementById("video");    myVid.muted=true;    function come() {        $("#video").show();        $(".img").hide();        $("#video").load();//执行一次加载一次,从头开始播放    }    function go() {        $(".img").show();        $("#video").hide();    }</script>

 

鼠标移入视频播放,鼠标移出播放停止,恢复到原来状态