Управление позицией воспроизведения трека в HTML5 теге AUDIO

Объект audio поддерживает установку текущей позиции воспроизведения через свойство — currentTime. Если попытаться установить значение выходящее за рамки трека, то javascript создаст соответствующее исключение. Потому следует использовать конструкцию try — catch. Отлавливать исключения не понадобится, только если вы точно уверены в правильности нового значения для currentTime.

Ваш плеер в HTML:

Пример скрипта:

Одного currentTime явно не достаточно, чтобы отслеживать и отображать позицию воспроизведения трека.

Общую длительность трека можно посмотреть в свойстве объекта duration.

Для отображения текущей позиции проигрывателя могут понадобиться обработчики следующих событий:

  • playing — вызывается при запуске (play) проигрывателя,
  • pause — вызывается про остановке (pause) проигрывателя,
  • timeupdate — вызывается при обновлении текущей позиции воспроизведения.

Пример подключения обработчика (на примере ‘pause’):

Вернуться к основной статье по управлению объектом HTML5 AUDIO из javascript.

Мало букафф? Читайте есчо !

Когда линтер позволяет себе слишком много

Июнь 29, 2023 г.

Обычно eslint и tslint друг с другом не взаимодействуют, но я попадал в ситуацию, когда правила работают совместно. Далее - как "заткнуть" их обоих ...

Читать

Анонимная имплементация интерфейса в kotlin

Январь 18, 2025 г.

На Java этот трюк хорошо обкатан, IDE Android Studio по одному клику вставляет шаблон для реализации кода выбранного интерфейса. На kotlin это работает ...

Читать

Увеличиваем время сессии phpMyAdmin в Open Server

Апрель 15, 2017 г.

Раздражает короткое время сессии в phpMyAdmin при работе с Open Server? Тогда вы попали по адресу. Меня тоже это раздражает - всего 1440 секунд, о чем они думали вообще? :). Сегодня дошли руки, чтобы сделать более удобные настройки. Файлы конфигурации ...

Читать

Обработка события click или touchstart

Октябрь 31, 2018 г.

Широкое применение мобильных устройств для доступа в интернет накладывает свои специфические требования на разработку веб-сайтов. Привычный обработчик onclick может срабатывать совместно с ontouchstart, а может не срабатывать вовсе на мобильном устройстве. ...

Читать
 

Комментарии к «Управление позицией воспроизведения трека в HTML5 теге AUDIO»

Понравилась статья? Есть вопросы? - пишите в комментариях.



Комментарий: