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

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

Ваш плеер в HTML:

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

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

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

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

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

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

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

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

Ноу Хау или добавление Wysiwyg + MCEditor в Drupal

Декабрь 2, 2009 г.

Установка и настройка софта обычно процесс простой и незатейливый. Тем не менее масса публикаций в интернете посвящена именно тому что и как настраивать. Всё это многообразие объясняется порою двумя словами - know how - или, по-русски, надо "знать как". ...

Читать

Как в PHP сделать буквы заглавными?

Сентябрь 13, 2016 г.

PHP обладает целым арсеналом работы со строками. Сделать буквы заглавными или наоборот перевести в строчные - нет ничего проще. Базовый набор функций для работы со строками содержит такие функции как: string strtolower ( string $string ); - ...

Читать

Псевдоклассы состояния контейнера input

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

Хотелось бы выделить такой перечень css псевдоклассов и приемов работы с ними, который основан на состоянии элемента INPUT. :checked псевдокласс Позволяет писать стили для радио/чек - боксов, которые выделены (checked) в текущий момент. [crayon-693633bb5e331646528310/] ...

Читать

Drupal checkbox field form API

Март 18, 2024 г.

Drupal интерпретирует чекбокс как integer. Это вызывает некоторое непонимание при работе с полем через Drupal form API. Давайте рассмотрим пример объявления и чтения данных поля формы. Объявление checkbox поля в вашей форме: [crayon-693633bb5e619292252212/] ...

Читать
 

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

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



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