javascript - HTML5 video autoplay and autostop when specific class on it -
i have slider of videos, want autoplay when visible , autostop when not visible. visible video @ moment of stay visible has class (active) identifies it.
<video class="item active" controls autoplay poster="" width="640" height="360"> <video class="item" controls autoplay poster="" width="640" height="360"> <video class="item" controls autoplay poster="" width="640" height="360">
how can that?
you can manipulate states of video javascript. playing example can select video tag have class active , play it:
document.queryselector('video.active').play();
for other video tags can pause them code:
var videos = document.queryselectorall('video.item'); for(var = 0; < videos.length; i++) { videos[i].pause(); }
you need make manipulation on click, or on slide change, , take note first need stop videos play video active class.
Comments
Post a Comment