미리보기 이미지를 클릭 할 때 동영상 재생

저는 JavaScript의 초보자입니다. HTML5에서 특정 시간 동안 mp4 파일을 재생하고 싶습니다. 먼저, 미리보기 이미지를로드하고 싶습니다. 클릭하면 특정 시간의 비디오 파일을 재생하고 싶습니다. 이것은 내 코드입니다. 그러나 그것은 효과가 없습니다. 나는 무엇을 잘못 했는가? 미리보기 이미지를 클릭 할 때 동영상 재생

function PlayVideo(aid, vid) { 
    var video = document.getElementById(vid); 
    video.addEventListener('loadedmetadata', function() { 
     videoStartTime = 6; 
     videoEndTime = 7; 
     this.currentTime = videoStartTime; 
    }, false); 

    video.addEventListener('timeupdate', function() { 
     if (this.currentTime > videoEndTime) { 
      this.pause(); 
      this.currentTime = 6; 
     } 
    }); 

    document.getElementById(aid).style.display = "none"; 
}

그리고 HTML 파일의 본문에

는 :

<a id = "anchor" onclick = "PlayVideo('anchor','vid');"> 
    <img src = "test.jpg" alt = "trail" /> 
</a> 
<video id = "vid" controls width = "320"> 
    <source src = "test.mp4" type = "video/mp4"/> 
</video>

출처

2013-07-02 user1610952

코드의 어느 부분이 실패합니까? 미리보기 이미지가로드됩니까? 올바른 재생 시간은 아니지만 재생됩니까? 정교하게 말하십시오. – drarkayl

thumnail이 성공적으로 loaed되었습니다. 그러나 클릭하면 비디오 플레이어가로드되지만 자동으로 시작되지 않습니다. 그리고 내가 그것을 할 때, 그것은 6 초부터 시작하지 않습니다. 그것은 처음부터 시작됩니다. – user1610952

난 당신이 어디서든 비디오를 시작 볼 수 없습니다 :

function PlayVideo(aid, vid) { 

    var video = document.getElementById(vid); 
    video.play(); // <- start play 

    //... 
}

또한 세계에서 canplay 이벤트를들을 수 있습니다 언제 비디오를 시작할 수 있는지 알 수 있습니다.

출처

2013-07-02 08:05:35 K3N

감사합니다. 그러나 그것은 여전히 처음부터 시작합니다. 6에서. – user1610952

@ user1610952 그리고 play() 다음에 현재 시간을 설정합니다 (6이 아닌지 확인). – K3N

흠 ...이 뜻 이니? : var video = document.getElementById (vid); video.play(); this.currentTime = 6; – user1610952

미리보기 이미지를 클릭 할 때 동영상 재생

답변

관련 문제