| | | | | |
Стоп, пуск в плеере html через javascript
Как остановить и запустить воспроизведение на плеере с помочью клавиатуры, у нас есть
плеер html.
На котором мы и будем тренироваться, чтобы заработал пуск и стоп…
Не будем все до последней крошки разжевывать…
Нам понадобится… как минимум
1. getElementById
2. keycode
3. getAttribute
4. setAttribute
Как вы заноете, чтобы обращаться к тегу, самое простое и наглядное это
идентификатор, например назовем его:
id="player"
И у нас еще в теге audio есть атрибут controls, по умолчанию поставим туда stop
controls="stop"
Src – наверное понятно – что это путь… до файла мп3
Теперь соберем это все вместе…
Код:
<audio controls="stop" style="width:700px" id="player" src="https://dwweb.ru/__a-data/mp3/digital_emotion_get_up.mp3"></audio>
Результат:
Теперь скрипт...
Логика такая – код кнопки пробела 32 – будем проверять по нажатию, пробела, что находится в атрибуте при первом нажатии срабатывает пуск play() и одновременно отправляется в атрибут пустота, второй раз нажимаем – это остановить… срабатывать pause() и отправляется в controls stop .
Довольно простой код…
Ну и далее вам остаётся только и всего... нажать на пробел... и потренироваться, как на нашем плеере работает воспроизведение и пауза на плеере html
<script>
document.onkeydown = function checkKeycode(event)
{
var keycode;
if(!event) var event = window.event;
if (event.keyCode) keycode = event.keyCode; // для IE
else if(event.which) keycode = event.which; // для всех браузеров
if( keycode=='32')
{
the_var = player.getAttribute('controls') ;
if(the_var=='stop')
{
document.getElementById('player').play(); player.setAttribute('controls', '');
}
else
{
document.getElementById('player').pause(); player.setAttribute('controls', 'stop');
}
}
}
</script>
Посмотреть пример и скачать можно по ниже идущей ссылке
Скрипт № 50.2
Название скрипта и номер :Стоп и пуск в простом audio плеере через javascript
Пример -
Стоп и пуск в простом audio плеере через javascriptСкачать -
архив
Все скрипты на
одной страницеС вашими куками, что-то не то..., попробуете перезагрузить страницу..
Теги:
Стоп, пуск в плеере html через javascript