Всем привет. На связи coderistu.ru. В этой статье я расскажу, как сделать воспроизведение скрытого аудиофайла на сайте при нажатии на кнопку или ссылку.
Итак, приступим:
1 Для начала подключаем к сайту библиотеку jquery. Если она у вас уже подключена- отлично! Если нет, то ее необходимо скачать по этой ссылке после чего подключить в хедере вашего сайта.
Если лень качать, то можно подключить ее удаленно с ресурсов Google, для чего в хедере необходимо разместить следующий код:
2 Далее нам необходимо сделать разметку нашей кнопки/ссылки и аудио:
<audio class="music" preload="auto" loop="loop">
<source src="https://freeuk17.listen2myradio.com/live.mp3?typeportmount=s1_4271_stream_647901959" controls="" autobuffer="" />
</audio>
где src="https://freeuk17.listen2myradio.com/live.mp3?typeportmount=s1_4271_stream_647901959" - путь до вашего аудио на сайте.
3 Отлично. Осталось только прописать скрипт, скрывающий аудио и запускающий музыку при нажатии на кнопку:
jQuery(function($){
$('.musicstart').on('click', function(){
$('.music')[0].play()
});
$('.music').hide();
});
</script>
На этом все. Надеюсь, что статья была вам полезной!
ДЕМОСКАЧАТЬ