비디오 DOM을 사용하여 재생을 일시 중지하고 재생합니다 .mp4 onmouseover/onmouseout

클릭하면 미리보기 이미지가있는 곳에 WordPress 사이트가 있습니다. 클릭하면 큰 비디오가 표시됩니다.비디오 DOM을 사용하여 재생을 일시 중지하고 재생합니다 .mp4 onmouseover/onmouseout

내 고객은 미리보기 이미지가 몇 초 동안 동영상을 재생할 수 있도록하고 커서가 미리보기 이미지 위에있을 때 커서를 떼면 시작 상태로 돌아갑니다.

나는 w3schools에서이 목적으로 버튼을 사용하는 경우를 보았습니다. onclick에서 onmouseover로 명령을 변경하면 비디오가 재생/일시 정지되었습니다. 비디오가 아닌 버튼에서 직접 할 수 있기를 바랍니다.

여기 W3 스쿨의 코드 (대부분의)입니다 : 내가 온 클릭에 onMouseover와의 코드를 변경 위치를 볼 수 있습니다

<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>

. 내가 묻는 것은 단추에서 비디오 자체로 트리거를 변경하는 방법입니다.

출처

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

답변

관련 문제