使用视频DOM暂停和播放.mp4 onmouseover/onmouseout

我将一个WordPress网站放在一起，其中有一个缩略图菜单，点击时会在页面上显示一个大视频。使用视频DOM暂停和播放.mp4 onmouseover/onmouseout

我的客户希望缩略图在光标位于缩略图上时播放视频的几秒钟，并在光标脱离时返回到其开始状态。

我在w3schools上看到了一个使用按钮的实例。当我将onclick命令更改为onmouseover时，它播放/暂停了视频。我希望能够直接在视频上完成，而不是一个按钮。

这里是（最）从W3Schools的代码：

<div style="text-align:center"> 
    <button onmouseover="playPause()">Play/Pause</button> 
    <br /> 
    <video id="video1" width="420"> 
    <source src="movie.mp4" type="video/mp4" /> 
    <source src="movie.ogg" type="video/ogg" /> 
    Your browser does not support HTML5 video. 
    </video> 
</div> 

<script type="text/javascript"> 
var myVideo=document.getElementById("video1"); 

function playPause() 
{ 
if (myVideo.paused) 
    myVideo.play(); 
else 
    myVideo.pause(); 
} 
</script>

在这里你可以看到我的onclick从到的onmouseover改变了代码。我想我问的是如何将触发器从按钮更改为视频本身。

来源

2012-03-24 Adam

<html> 
<head> 
</head> 
<body> 
<div style="text-align:center" onmouseout="playPause()"> 
    <video id="video1" width="160"> 
    <source src="movie.mp4" type="video/mp4" /> 
    <source src="movie.ogg" type="video/ogg" /> 
    Your browser does not support HTML5 video. 
    </video> 
</div> 

<script type="text/javascript"> 
var myVideo=document.getElementById("video1"); 

function playPause() 
{ 
if (myVideo.paused) 
    myVideo.play(); 
else 
    myVideo.pause(); 
} 
</script> 
</body> 
</html>

来源

2012-03-24 17:52:28 Adam

使用视频DOM暂停和播放.mp4 onmouseover/onmouseout

回答

相关问题