首页 > 代码库 > 鼠标移入视频播放,鼠标移出播放停止,恢复到原来状态
鼠标移入视频播放,鼠标移出播放停止,恢复到原来状态
<!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>
鼠标移入视频播放,鼠标移出播放停止,恢复到原来状态
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。