Инструменты пользователя
tag_audio_html5
Различия
Здесь показаны различия между двумя версиями данной страницы.
| Предыдущая версия справа и слева Предыдущая версия Следующая версия | Предыдущая версия | ||
|
tag_audio_html5 [2014/04/10 16:23] admin |
tag_audio_html5 [2014/04/10 20:31] (текущий) admin [Отложенная загрузка данных] |
||
|---|---|---|---|
| Строка 6: | Строка 6: | ||
| <code> | <code> | ||
| - | <audio id="player" src="http://193.107.239.146:8000/radio" controls autobuffer> </audio> | + | <audio id="player" src="test.mp3" controls autobuffer> </audio> |
| <script> | <script> | ||
| Строка 20: | Строка 20: | ||
| ===== Если прерывается трансляция, возобновляем проигрывание ===== | ===== Если прерывается трансляция, возобновляем проигрывание ===== | ||
| + | Собственно, когда нажимаем play, запускается по таймауту функция которая определяет, остановилось ли воспроизведение, и если оно остановилось, то просто его запускает вновь. Также навешено событие на нажатие на паузу - отключение таймера, чтобы не возобновлялось воспроизведение, когда пользователь решил остановить. | ||
| + | |||
| + | <code> | ||
| + | <audio id="player" src="http://193.107.239.146:8000/radio" controls autobuffer> </audio> | ||
| + | |||
| + | <script> | ||
| + | var numt = 0; | ||
| + | |||
| + | function play_always() { | ||
| + | player = document.getElementById('player'); | ||
| + | |||
| + | if (player.paused) | ||
| + | player = document.getElementById('player').play(); | ||
| + | |||
| + | numt = setTimeout('play_always()', 1000); | ||
| + | } | ||
| + | |||
| + | player = document.getElementById('player'); | ||
| + | player.onpause = function(event) { clearTimeout(numt); } | ||
| + | player.onplay = function(event) { play_always(); } | ||
| + | |||
| + | </script> | ||
| + | </code> | ||
| + | |||
| + | ===== Отложенная загрузка данных ===== | ||
| + | |||
| + | Чтобы плеер не загружал файл или поток при открытии страницы, можно поступить так: | ||
| + | |||
| + | <code> | ||
| + | <audio id="player" controls autobuffer> </audio> | ||
| + | |||
| + | <script> | ||
| + | var numt = 0; | ||
| + | var first = true; | ||
| + | |||
| + | function play_always() { | ||
| + | player = document.getElementById('player'); | ||
| + | |||
| + | if (player.paused) | ||
| + | player = document.getElementById('player').play(); | ||
| + | |||
| + | numt = setTimeout('play_always()', 1000); | ||
| + | } | ||
| + | |||
| + | player = document.getElementById('player'); | ||
| + | player.onpause = function(event) { | ||
| + | clearTimeout(numt); | ||
| + | } | ||
| + | |||
| + | player.onplay = function(event) { | ||
| + | if (first) { | ||
| + | player = document.getElementById('player'); | ||
| + | player.src = "http://193.107.239.146:8000/radio"; | ||
| + | first = false; | ||
| + | } | ||
| + | play_always(); | ||
| + | } | ||
| + | |||
| + | </script> | ||
| + | </code> | ||
| + | То есть с помощью <code>player.src = "http://193.107.239.146:8000/radio";</code> мы даем данные тогда когда нам это нужно. Иначе плеер качает сразу при открытии. | ||
| + | Да, кстати first в данном случае играет заглушку, которая дает загрузку данных только один раз. | ||
| ===== Живой пример ===== | ===== Живой пример ===== | ||
| - | Все эти моменты нам помогло при создании [[http://radio.pipec.tv/|интернет-радио]]. | + | Все эти хитрости нам помогли при создании [[http://radio.pipec.tv/|интернет-радио]]. |
tag_audio_html5.1397132583.txt.gz · Последние изменения: 2014/04/10 16:23 — admin
Инструменты страницы
За исключением случаев, когда указано иное, содержимое этой вики предоставляется на условиях следующей лицензии: CC Attribution-Share Alike 4.0 International
