4

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

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

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

2
  • Да? А а рекламу кто вам платить будет тогда? Нет перезагрузки страницы, нет прибыли с рекламы.
    – Марк
    8 мая 2017 в 6:05
  • У ВК нет прибыли с рекламы? Сильно сомнительно :)
    – andreymal
    8 мая 2017 в 6:18

1 ответ 1

5

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

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

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

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

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

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

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

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

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

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

4
  • Ворон, большое спасибо за подробный ответ, все очень понятно разъяснили. Понимаю, что AJAX лучше всего, но много переверстывать сейчас придется, проект уже готов. Будет ли быстрее сделать постоянное всплывающее окно (над объектом window), которое будет висеть над всеми перезагружаемым страницами (сверху) с аудиоплеером внутри. Это реально? В инете порылась, но есть намеки, как это сделать, но ничего конкретного. Есть ли плагин, которым можно сделать такую задачу и вообще решаема ли задача в таком ключе или я фантазирую? 7 фев 2015 в 13:19
  • 2
    @Olga Moscow, окно-то сделать можно, только вот... Как я это вижу, для пользователя будет странно все это. Да и всякие popupы блокироваться могут. Так что сомневаюсь, что это хорошая идея. Посмотрите [ответы здесь](http://stackoverflow.com/questions/15612120/how-do-i-make-an-audio-file-play-continuously-on-all-pages) - один ответ содержит упоминание popupa, другой ответ вроде как показывает автовоспроизведение после перезагрузки страницы.
    – BOPOH
    7 фев 2015 в 15:02
  • @ВОРОН, большое спасибо! Я этот ответ уже находила, вчера полночи по инету бродила...))Я хотела сделать pop up окно, скрыть его для пользователя и пусть себе гуляет по сайту. а музыка играет...Невидимое окно с плеером сделать. Как сделать AJAX загрузку на страницу сделать нашла stackoverflow.com/questions/14735762/…. Конечно, Ваш ответ с AJAX наиболее грамотное решение. Но оно сейчас по времени уже не осуществимо.. Повешу остановку музыки на закрытие окна и пусть играет только на главной странице.)) А AJAX разучу пока, он будет нужен. 7 фев 2015 в 17:53
  • open your audio player in a popup. Только как сделать, чтобы плеер открывался в этом окне и при этом окно было невидимым.)) 7 фев 2015 в 17:58

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.