Новый плеер!
Как встроить видео и аудио на сайт? Как вставить видео проигрыватель? FLV и MP3 плееры для сайта скачать бесплатно!

← Модель для сборки

← Форум
 MP3-плеер →
Вставка MP3-плеера через JavaScript (SWFObject)

SWFObject — это самое распространенное решение для публикации flash-файлов с помощью JavaScript. От классического способа с помощью HTML, динамический способ публикации через JavaScript имеет серьезные преимущества:
  • можно легко контролировать наличие flash-плеера нужной версии от Adobe на сайте пользователя, а также включать автоматическую экспресс-инсталяцию плеера, если он устарел или его вовсе нет;
  • если произошла ошибка исполнения страницы, у посетителя выключен JavaScript, либо не установлен flash-плеер, вместо флеша можно показывать альтернативный контент;
  • динамический способ публикации устраняет неприятный момент активации flash-роликов кликом мыши в некоторых браузерах (IE Eolas Update);
  • публиковать с помощью SWFObject очень просто.

Пример:

Нужно скачать последнюю версию SWFObject (нужен файл swfobject.js и expressInstall.swf, если вы хотите использовать экспресс-инсталяцию flash-плеера в случае его отсутствия).

Создадим файл html следующего содержания (курсивом указаны примечания):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd>
<html xmlns=http://www.w3.org/1999/xhtml lang="en" xml:lang="en">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="swfobject.js"></script>
<!-- Здесь мы включили в документ SWFObject -->
<script type="text/javascript">
var flashvars = {way:"http://yoursite.com/sample.mp3", swf:"http://yoursite.com/ump3player.swf", w:"470", h:"70",skin:"red", time_seconds:"164", autoplay:"0", q:"0", volume:"70", comment:"Название"};
// Здесь мы перечислили параметры flashvars настройки плеера
var params = {wmode:"transparent"};
// Здесь мы указали в параметрах прозрачный фон flash-ролика
var attributes = {id:"uplayer_mp3",name:"uplayer_mp3"};
// Здесь мы указали в атрибутах идентификатор и имя объекта в документе
swfobject.embedSWF("http://yoursite.com/ump3player.swf", "uplayer_mp3", "470", "70", "8.0.0", "http://yoursite.com/expressInstall.swf", flashvars, params, attributes);
// Здесь мы запустили SWFObject для публикации flash-ролика в формате: путь к файлу, id блока для публикации, ширина, высота, минимальная версия flash-плеера, путь к файлу экспресс-инсталяции, flashvars переменные, params параметры, attributes атрибуты
</script>
</head>
<body>
<div id=uplayer_mp3>
<a href=http://www.adobe.com/go/getflashplayer>
<img src=http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif alt="Get Adobe Flash player" />
</a>

</div>
<!-- Здесь мы создали блок (div), где будет размещен наш плеер (id указывается в строке запуска SWFObject).
Внутри этого блока размещается альтернативный контент, который пользователь увидит, если у него нет flash-плеера или его версия ниже той, которую мы указали в строке запуска SWFObject -->

</body>
</html>

flv-mp3Ссылка на пост (cмотрели 29073)28.12.07 12:41  Ответить
Ваше имя*
 E-mail* (не публикуется)
 Сайт
* Обязательные поля Получить уведомление об ответе по почте
1
Lucifer 01.12.08 - 04:23
Все конечно замечательно, но не у каждого ведь есть желание и возможность обьявлять параметры и переменные в заголовке html документа…
допустим что пользователю на каждую из страниц нужно вставить определенный плеер для кажой страницы файлы которые он будет проигрывать разные.. естественно ему прийдется динамически генерить все параметры перед загрузкой страницы…
2
Senyai 06.04.09 - 22:38
Здравствуйте! Вставляю ump3player_500x70.swf через swfobject.embedSWF с autoplay=1. Всё работает, но есть очень неприятная ошибка, которая проявляется только в firefox. Возможно дело в нем, но мне кажется вы должны знать. У меня есть длинный список mp3 и сам плеер расположен вверху страницы. Нажимаем на mp3, идёт swfobject.embedSWF и играется музыка. Спускаюсь по списку вниз и плеер прячется. Теперь, если нажать на mp3 ничего играться не будет, т.к. плеер не виден. Если пролистать страницу вверх до плеера, то музыка сразу заиграет. Пожалуйста, если сталкивались, подскажите.
3
Senyai 07.04.09 - 00:06
Еле нагуглил. Надо поставить wmode в режим window, тогда всё ок. И цвет фона задаётся через bgcolor. Пожалуйста, поставьте комментарий к строке wmode:"transparent"! Спасибо за плеер!
4
Дима 03.04.12 - 11:47
попробуй через
5
Алексей 09.08.10 - 15:15
Здравствуйте! Скажите пожалуйста,а можно сделать в плеере так,чтобы панель управления плеером(play,pause,stop) появлялась только при наведении? Именно в режиме «Вставка MP3-плеера через JavaScript (SWFObject)» Если возможно,то как? жду ответа!
А вообще плееры у Вас супер! Лучший сервис в рунете!
6
flv-mp3 18.08.10 - 16:45
На uppod.ru можно
7
loldop 20.08.10 - 19:02
ммм… а кто-нибудь может сказать, что есть
ссылка
и на что он должен указывать?
8
Shved 23.11.11 - 13:11
9
len777den 05.09.11 - 16:13
Добрый день.
У меня не отображается ни плеер ни мп3 файл.
Подскажите,Люди Добрые.
Вроде все сделала по инструкции
10
Сергей 25.01.12 - 22:42
Здравствуйте! У меня на сайте на одноой страничке есть несколько музикальных треков. Для каждого трека я подключаю плеер








и так несколько раз…
Вопрос: как сделать, когда играет один трек и мы нажимаем на другой (плей), что бы первый переставал играть.
Был бы благодарен за ответ
11
Кикки 15.08.13 - 16:59
Скажите а зачем загружать файл плеер .swf на свой хостинг (сайт)? Или можно не загружать? у меня пока все работает и без этого. Это обязательно?
12
Нэля 01.01.14 - 18:14
Я бы тоже хотела об этом узнать, но нигде не нашла ответа . Собираю плеер,вставляю код в программе для верстки сайта и все! Плеер работает ! Нужно ли грузить файл плеера и файл музыки на хостинг в корневую папку?
RSS RSS темы MP3-плеер / RSS комментариев     U Forum 0.1 ()