Главная    Реклама    Об авторе    Muzzлог Зарубина    Кладбище полезностей    Зигзаг сайтов

Музыка фоном по понятиям или flash mp3 player Mju

18.08.2008 от Андрей Зарубин

Не так давно я написал ультракороткий и мегаполезный пост про автономный flv player на сайт. Теперь же, по прихоти того же заказчика, который никого не желает слушать кроме себя, мне пришлось искать способ создания фоновой музыки на сайте.

Примитивные способы, а ля использование тега , простеньких javascript’ов я сразу же отмел с негодованием, ибо мы простых путей не ищем :) Шутка, просто все вышеперечисленные способы имеют дохрена недостатков, таких как: нет буфферизации (ведь я с собираюсь проигрывать фоном не midi, а mp3, да еще и в хорошем качестве), при переходе на другую страницу трек начинает проигрываться сначала и много других косяков.

Погуглив по этому поводу я вышел на такой вот интересный flash mp3 player Mju. Хорошая штука, скажу вам прямо! Достоинства этой программы:

mju умеет…

— проигрывать треки или потоки, список которых хранится в текстовом файле-плейлисте;
— запоминать номер трека и позицию в треке, чтобы при переходе по страницам вашего сайта вы продолжали, а не начинали слушать заново одно и то же;
— играть в режиме повтора текущего трека (loop), при этом перейти на следующий/предыдущий трек можно с помощью стрелок;
— играть треки в случайном порядке (shuffle);
— распознавать русские названия песен, при условии, что кодировка файла с плейлистом совпадает с кодировкой страницы, в которой находится плеер;
— регулировать громкость и баланс звука и запоминать ваши настройки;
— слушаться команд на расстоянии одной страницы (об этом читайте в разделе [трюки с плеером].

Он полупрозрачный и будет смотреться на фоне любого цвета.

Недостатки (копирайт мой):

— Навязчивый и громоздкий интерфейс плеера. В самом деле, нафига он мне на сайте? Если я только лишь хочу играть фоном музыку. И как я впишу его в дизайн?

Но ко всем вышепреведенным недостаткам (хренасе, их аж 1 О_о) есть лекарство:

Смотрим код плеера, который вставляется на сайт.

Перепробовав всяческие варианты с прозрачными div и так далее, и убедившись что ничего не работает, я просто поменял значения width и height в тегах object (для ie) и embed (для всего остального прогрессивного) на 1px. То есть плеер превратился в 1 маленькую белую точку. Запрятав код плеера в div я абсолютным позиционированием спрятал его туда, где его не заметно ;)

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

включить в код html файла еще и файл index.js (там описываются js команды плеера) и сделать две (можно и больше, читаем здесь) ссылочки, одна из который будет Pause, а вторая Play

<script src="ваша_мегапапка/index.js" type="text/javascript"></script>

<a onclick="mju_do('play')" href="javascript:play">Play</a>/

<a onclick="mju_do('pause')" href="javascript:pause">Pause</a>

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

И еще: не читайте это!

__

ШОК! Стимми послал всех нахуй!

» Abonner au RSS! «

Рубрики: javascript, Софт, дизайн |

Комментарии (5)

  1. Andrey пишет:

    Не знаю как вам, а мне очень было интересно почитать такого рода информацию!

  2. Alek пишет:

    Приветствую труженика от имени студии “АЭОТИКА”. Поздравляю со смекалкой, но хочу отметить, что практически так и сделано на самом сайте плеера МЬЮ и плеера РАА (http://raa.aeotika.ru) - на главной странице плеер представлен в полном виде, а на всех остальных “скрыт” дивом-пикселем. Если включить плеер на главной и перейти на другую страницу, то на фоне будет музыка именно благодаря такому “трюку” :)

    Удачи!

  3. Андрей Зарубин пишет:

    Ы, Alek, прикольно, но я не заметил как-то. А по-поводу пиксела — жаль, что нельзя менять цвет плеера, а то на черном фоне белая точка) Хотя ее, конечно, можно засунуть куда-подальше)))

  4. Krat пишет:

    2 Андрей Зарубин

    А если написать что-то вроде style=”position:absolute; top: -100px”?

  5. Андрей Зарубин пишет:

    Krat, надо попробовать

Оставить комментарий