Встроенное видео в слайдере
Всем Привет!
Есть простой слайдер на javascript, из картинок и видео встроенное через iframe. Задача - сделать чтобы при воспроизведении видео, слайдер останавливался, a при нажатии на паузу продолжал свою работу. Я только начал изучать этот язык, вот и столкнулся с первыми трудностями )) Буду благодарен за помощь!! Сам код:
var secDuration = 4;
var image = 1;
var maxImages = 5;
var slider = document.getElementById('slider');
var timeout
function changeImage(requiredImage) {
if (!requiredImage && requiredImage != 0){
if(image < maxImages){
image++;
}
else{
image = 1;
}
}
else{
if(requiredImage > maxImages){
image = 1;
}
else if(requiredImage < 1){
image = maxImages;
}
else{
image = requiredImage;
}
}
slider.className = "image"+image;
clearTimeout(timeout)
timeout = setTimeout("changeImage()",secDuration*800);
}
function nextImage(){
changeImage(image+1);
}
function prevImage(){
changeImage(image-1);
}
changeImage(1);
|
А в чем проблема?
Обрабатывайте клик по "плею" - кликнули очищаем интервал (clearInterval(timeout)) Закончилось воспроизведение - тут в зависимости от плейера который используете, если какой то html5-плейер он наверняка бросает событие соответствующее, если крутите ютуб-видео, то тут не знаю, наверняка должны тоже быть какие то API - разберитесь и так же обрабатывайте - запускайте setInterval по новой. |
использую player с ютуба, и в этом проблема.. не знаю как запустить заново таймер после окончания видео
|
Тогда вам сюда:
https://developers.google.com/youtub..._api_reference Вооружившись знанием английского или учебником по оному, читать и искать нужные вам методы и события. Здесь ничего подсказать не могу - надо сидеть разбираться. Обратите внимание на раздел Playback status Можно конечно еще в бесконечном setInterval отслеживать состояние кнопочки play-pause (у нее класс меняется с ytp-button-play на ytp-button-pause) =DDDDD Но это конечно в случае полной безнадеги ))) |
| Часовой пояс GMT +3, время: 06:04. |