Как сделать фоновую мелодию для веб-страницы из mp3-файла?
Для начала - убедиться, что она нужна. Я, например, считаю, что единственное место во всём Вебе, где уместны фоновые мелодии - это игры. Пожалуйста, ставьте такие скрипты только в них.
Так как стандарт очень долго хранил молчание насчёт фоновых мелодий, каждый браузер реализовывал его по-своему
Путаница тут страшная. <embed>, который часто советуют, например, требует от Firefox подгружать плагин. <audio> толком не поддерживается даже в IE. Да и вообще, ещё 2 года назад разные браузеры поддерживали разные форматы и табличка выглядела приблизительно так:
Так что используйте JPlayer. Но иногда и он обваливается с ошибкой, что b.test - не является функцией :(.
Мне jPlayer не помог. Пришлось родить кроссплатформенное решение:
В IE я это, впрочем, пока не тестировал.
Первый блок - исключительно для Opera. Во втором не забываем loop="loop" - Chrome игнорирует Playcount.
Важно помнить, что object в Firefox не понимает loop. Так что просто ставьте большой playcount. А вот webkit-браузеры понимают его слишком хорошо и будут играть мелодию, даже когда вы покините сайт. Поэтому не забудьте убрать param loop во втором блоке.
И никогда не пытайтесь сгенерировать этот код через JavaScript. Такая реализация страшно тормозит даже на локальном компьютере.
А ещё не забывайте, что браузеры - умные создания и если поместить эти object'ы в скрытый блок (не важно, через, display: none; или visibility: hidden), Firefox их проигрывать не будет.
Причём мы говорим, разумеется, о desktop-ных браузерах. Про мобильные даже вспоминать страшно.
Для начала - убедиться, что она нужна. Я, например, считаю, что единственное место во всём Вебе, где уместны фоновые мелодии - это игры. Пожалуйста, ставьте такие скрипты только в них.
Так как стандарт очень долго хранил молчание насчёт фоновых мелодий, каждый браузер реализовывал его по-своему
Путаница тут страшная. <embed>, который часто советуют, например, требует от Firefox подгружать плагин. <audio> толком не поддерживается даже в IE. Да и вообще, ещё 2 года назад разные браузеры поддерживали разные форматы и табличка выглядела приблизительно так:
| Browser | Ogg | MP3 | WAV |
|---|---|---|---|
| FireFox 3.6+ | ✓ | ✓ | |
| Safari 5+ | ✓ | ✓ | |
| Chrome 6 | ✓ | ✓ | |
| Opera 10.5+ | ✓ | ✓ | |
| Internet Explorer 9 (beta) | ✓ | ✓ |
Так что используйте JPlayer. Но иногда и он обваливается с ошибкой, что b.test - не является функцией :(.
Мне jPlayer не помог. Пришлось родить кроссплатформенное решение:
<bgsound src="sound/plan.mp3" loop="1"> <object id="opera_player1" data="sound/plan.mp3" type="application/x-mplayer2" width="0" height="0"> <param name="filename" value="sound/plan.mp3"> <param name="autostart" value="1"> <param name="autoplay" value="1"> <param name="hidden" value="1"> <param name="playcount" value="9999"> </object> <audio src="sound/plan.mp3" autoplay="autoplay" loop="loop"> <object id="webkit_player" data="sound/plan.mp3" type="application/x-mplayer2" width="0" height="0"> <param name="filename" value="sound/plan.mp3"> <param name="autostart" value="1"> <param name="autoplay" value="1"> <param name="hidden" value="1">> </object> </audio>
В IE я это, впрочем, пока не тестировал.
Первый блок - исключительно для Opera. Во втором не забываем loop="loop" - Chrome игнорирует Playcount.
Важно помнить, что object в Firefox не понимает loop. Так что просто ставьте большой playcount. А вот webkit-браузеры понимают его слишком хорошо и будут играть мелодию, даже когда вы покините сайт. Поэтому не забудьте убрать param loop во втором блоке.
И никогда не пытайтесь сгенерировать этот код через JavaScript. Такая реализация страшно тормозит даже на локальном компьютере.
А ещё не забывайте, что браузеры - умные создания и если поместить эти object'ы в скрытый блок (не важно, через, display: none; или visibility: hidden), Firefox их проигрывать не будет.
Причём мы говорим, разумеется, о desktop-ных браузерах. Про мобильные даже вспоминать страшно.
Комментариев нет:
Отправить комментарий