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

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

Ваш плеер в HTML:

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

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

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

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

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

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

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

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

Как разделить рендеринг WP_Widget для front и back-end?

Февраль 21, 2023 г.

Метод widget, который реализуется для отрисовки содержимого виджета вызывается одинаково для фронта и бек-енда. Но, если вы не утруждаете себя созданием необходимых для рендеринга на бек-енде стилей, то результат не похож, на то что вы увидите на фронте. ...

Читать

Авторизация по номеру телефона в Drupal

Октябрь 28, 2015 г.

Распространение сотовой связи сделало уместным идентификацию пользователя по номеру телефона. Этот номер стал на ряду с логином и адресом электронной почты ...

Читать

Модуль для WP Counter Integration

Октябрь 30, 2015 г.

На днях собрал модуль для подключения счетчиков на сайт под WP. Он позволяет добавить код Метрики Яши и Аналитики Гоши. Сегодня я его уже записал в репозиторий wordpress.org. Он решает задачу по размещению кода счетчика на страницах сайта, но не ...

Читать

Рендер ссылки в twig

Октябрь 3, 2021 г.

В шаблонах twig вы можете использовать функцию link, для рендера ссылки. Параметры вызова следующие - link($text, $uri, $attributes = {}), первые два - обязательные. [crayon-699290c18f0fa674180265/] Результатом будет следующий HTML код: ...

Читать
 

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

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



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