как играть музыку в фоновом режиме на разных страницах

Я прочитал этот вопрос, и я понимаю, что его можно сделать только с фреймами (я действительно не хочу AJAX на полном сайте): Как воспроизвести фоновый звук на нескольких HTML-страницах.?

Мой вопрос в том, что есть ли способ иметь небольшой или, возможно, невидимый кадр, который воспроизводит музыку и какой-то красиво оформленный элемент управления для нее где-то в главном кадре? На самом деле я хотел бы решить его с помощью SoundCloud, но если это невозможно с этим, тогда я открыт для какого-то пользовательского проигрывателя, такого как FlowPlayer или SoundManager 2.

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

Какой был бы лучший способ сделать это?

Обновление : Конечно, я не хочу, чтобы музыка начиналась автоматически.

Я настоятельно рекомендую против этого, но если вы действительно этого хотели, есть несколько вариантов:

  1. Рамка
  2. Full-site AJAX (не так уж и отличается от фрейма, но более приятный вариант)
  3. Синхронизация проигрывателя AJAX
  4. URL Параметр + Переписать ссылки
  5. Выскакивать

Рамка / Сайт AJAX

Кадр, вероятно, является «лучшим» случаем (он будет отображаться как один сайт для ваших зрителей). Полный AJAX на самом деле в основном тот же принцип. Однако вы сказали, что против этих вариантов (но не почему).

Синхронизация AJAX-плеера

Синхронизация AJAX-плеера будет заключаться в хранении файла cookie для идентификации пользователя и вызова AJAX-плеера, который сохранил текущее время воспроизведения песни для текущего пользователя.

Затем, на загрузке страницы, вы можете найти это время и начать там песню.

Тем не менее, вы по-прежнему получаете небольшие переходы между страницами (сравнимо с тем, когда вы играете на YouTube во встроенном кадре, а затем на полпути через песню пропускаете «настоящий YouTube», а не встроенное видео, и оно продолжается, за исключением того, что они делают это с передачей URL-адреса).

URL Параметр + Переписать ссылки

Другим способом достижения опции «синхронизация» было бы иметь параметры URL, которые определяют текущий момент песни. Затем на каждом «тике» (скажем, секунду / половина секунды) вы можете использовать JavaScript, чтобы переписать все ссылки на странице, чтобы включить обновленный параметр URL. Однако это будет означать, что если кто-то откроет ваш сайт в новой вкладке / окне / без нажатия ссылки на вашей странице, игрок перезапустится. В любом случае это произойдет в большинстве этих вариантов, хотя это, возможно, не является реальным недостатком.

Способ сделать это:

  1. Убедитесь, что ваш загрузчик Player проверяет параметр URL GET чтобы определить время начала воспроизведения.
  2. Имейте функцию jQuery / JS «tick», которая выполняется каждые n миллисекунд (вам нужно будет протестировать, чтобы найти идеальный вариант, я бы предположил, что минимум 500/1000 мс).
  3. В функции «tick» все ссылки (теги с href ) изменяют ?paramname=0 который вы добавили к ним, чтобы использовать новое время начала.

Если вы можете установить файлы cookie из javascript (чего я не думаю, что вы могли бы, но могут быть обходные пути сейчас), это может быть сделано еще проще, если ваш игрок проверяет куки-файл при загрузке, а затем, когда ваша функция галочки обновляет файл cookie а не переписывать все URL-адреса.

Выскакивать

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

Моя рекомендация

Моя рекомендация – не воспроизводить музыку без разрешения – иметь игрока (который может быть на кадре / в неизмененном компоненте полного AJAX-сайта / в всплывающем окне), для которого требуется щелчок пользователя. В качестве альтернативы, убедитесь, что музыка достаточно хороша, что они захотят, чтобы YouTube / их медиаплеер играл в фоновом режиме в любом случае.

Вернитесь во времени к 1990-м годам, когда фреймы не устарели, а фоновая музыка на веб-страницах еще не была вычеркнута. Если вы действительно должны это сделать, сделайте всплывающее окно игрока, например, iPlayer BBC для радиопередач.

Я использовал совместимый с кроссбраузером и iOS (html5 и flash fallback) плагин jQuery с именем JPlayer и создал скрипт, чтобы сохранить текущее время воспроизведения в файле cookie, когда вызывается событие выгрузки окна.

Получите jQuery, jquery.JPlayer, jquery.Cookie. И зарегистрируйте $ (window) .unload (), чтобы сохранить файл cookie. Когда окно загружает проверку для позиции воспроизведения файла cookie и выполняет jPlayer («воспроизведение», сохраненное скопление)