저는 소프트웨어 개발자를위한 다양한 개념을 보여주기 위해 비디오 포트폴리오 사이트를 설정하고 있으며 종종 동일한 비디오의 여러 버전이 있습니다.
나는 비디오를 변경하기 위해 다음 자바 스크립트를 작성했으며 로컬에서 잘 작동하지만 호스트 변경 비디오가 비디오 플레이어를 중단하면 문제가 발생합니다. 원인은 새 비디오가로드되지 않았기 때문이라고 생각합니다. 어떤 아이디어?
function switcher(wrapper, e, source, container, video){
//get current version and turn off its style
var off = document.getElementById(wrapper).getElementsByClassName("versionActive")[0];
off.className = "version";
//turn on the new button
e.className = "versionActive";
var videoSource = document.getElementById(source);
var videoContainer = document.getElementById(container);
lastPlayingVideo.currentTime = 0;
lastPlayingVideo.pause();
lastPlayingVideo = videoContainer;
videoSource.setAttribute('src', video);
videoContainer.load();
videoContainer.play();
}
비디오 플레이어의 html은 다음과 같습니다.
<video id="container1" controls="" loop="" preload="auto" width="1280" height="720">
<source id="video1" src="videos/Reminder.mp4" type="video/mp4">
</video>
시도해보십시오 :
videoContainer.addEventListener('canplay', function() {
videoContainer.play();
videoContainer.removeEventListener('canplay');
});
videoSource.setAttribute('src', video);
videoContainer.load();
canplay 브라우저가 파일을 충분히 받았다고 가정하면 시작되며 연결 속도를 고려하여 계속 재생할 수 있습니다.
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다