Mp3 аудио продолжает играть при переходе по страницам

Рейтинг: 4Ответов: 1Опубликовано: 07.02.2015

Есть скрипт, который проигрывает музыку на одной странице:

<!-- Simple audio playback -->
<audio loop="loop" autoplay="autoplay"> 
<source src="img/site-music.mp3" type="audio/mpeg">
</audio>

Но при переходе на другую страницу сайта музыка обрывается и начинает играть с самого начала вместо того, чтобы продолжить играть дальше. Три часа поисков в гугле ничего не дали, кроме замечаний в разных блогах, что "музыка на сайте - это плохо". Вдобавок ко всему, когда закрываешь сайт на планшете, музыка продолжает играть! И исчезает только при перезагрузке! Как это понимать? Подскажите, пожалуйста, плагин для бесконечного проигрывания фоновой музыке, которая продолжается при переходе по страницам. Заранее спасибо!

Ответы

▲ 5Принят

Судя по всему, у вас каждая страница подгружается самостоятельно. Т.е. при переходе между страницами каждый раз происходит загрузка страницы. Отсюда и сбрасывание текущего воспроизведения - плеер ведь не знает о том, что вы перешли между страницами. Для него каждая страница - это новое открытие страницы.

Отсюда вывод: надо либо сказать плееру, что мы проигрывали через куки (не знаю, есть ли плеер, который это может), либо делать автоподгрузку страниц (т.е. использовать шаблоны).

При использовании шаблонов у вас будет одна страница, контент которой меняется через AJAX-запросы. В таком случае ваш плеер можно будет расположить вне динамического контента, тогда он будет играть постоянно, даже при переходах между страницами.

Но плагин, который привел я, вроде как имеет один недостаток: все страницы доступны только по одному адресу. Поэтому нельзя будет дать ссылки на разные страницы (например, на контакты, меню и т.д.) - все ссылки будут вести только на главную страницу.

Но и это не проблема: некоторые плагины для jquery (и не только для него) поддерживают изменение строки браузера, при этом сам механизм работы остается прежним. Таким образом у каждой страницы будет свой собственный адрес (через хэштеги), но фактически работать вы будете по-прежнему с одной страницей. Т.е. ваш плеер будет продолжать играть без перерыва.

Так, например, сделано у VK и OK.

Насчет плеера, который через куки ловит, что надо проигрывать: не уверен, что такие вообще есть, т.к. в данном случае каждый раз при переходе между страницами придется загружать один и тот же аудиофайл (что не быстро).

Даже если файл будет быстро загружен, то при переходе между страницами все равно будет заикание, т.к. в момент перехода текущий dom будет уничтожен, а новый с плеером еще не загрузился.

А про фоновое воспроизведение на планшете: сам давно уже не работаю с html/js, поэтому точно не помню. Вроде как страница не закрывается, а просто сворачивается, поэтому воспроизведение и продолжается. Все, что надо, - ловить момент сворачивания и ручками останавливать воспроизведение, при разворачивании - продолжать воспроизведение.

Хотя еще раз - уже давно не работал с этим, может быть, там какие-то другие особенности.