Встроенное видео в слайдере
Всем Привет!
Есть простой слайдер на 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, время: 15:17. |