not had much luck in trying to figure this out.
I have a video tag with a video in like so:
<video id="video" preload="auto" tabindex="0" controls poster="img/layout/Untitled-1.jpg">
<source type="video/mp4" src="video/1.mp4" >
Sorry, your browser does not support HTML5 audio.
</video>
<ul id="playlist">
<li class="active"><a href="video/1.mp4">GetFighted</a></li>
<li><a href="video/2.mp4">ThatGirlPossessed</a></li>
<li><a href="video/3.mp4">WhiteDevil</a></li>
</ul>
And using javascript and jquery im trying to loop through the list items (this list could be longer or shorter it will be user controlled ) and put them into the video itself, this works fine with this:
jQuery(document).ready(function($) {
var video;
var playlist;
var tracks;
var current;
init();
function init(){
current = 0;
video = $('video');
playlist = $('#playlist');
tracks = playlist.find('li a');
len = tracks.length;
video[0].volume = .50;
playlist.find('a').click(function(e){
e.preventDefault();
link = $(this);
current = link.parent().index();
run(link, video[0]);
});
video[0].addEventListener('ended',function(e){
$('#video').animate({opacity: 0}, 500);
setTimeout(function(){
current++;
if(current == len){
current = 0;
link = playlist.find('a')[0];
console.log('here 1');
} else {
link = playlist.find('a')[current];
console.log('here');
}
$('#video').animate({opacity: 1}, 500);
run($(link),video[0]);
},500);
});
}
function run(link, player){
player.src = link.attr('href');
par = link.parent();
par.addClass('active').siblings().removeClass('active');
video[0].load();
video[0].play();
}
});
(this code was taken from another source as a reference, i forget where). However what i am having trouble in doing is stopping the video once it has looped through all 3. The console log 'here 1' triggers once all 3 videos have played but i can't figure how to stop the video once it has played through once.
Any help would be fantastic.
Just add
video[0].addEventListener('loadstart', function(e){
video[0].pause();
});
before your
console.log('here 1');
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.