Javascript.RU

Скрипт музыки на сайт. Фоновая музыка на сайте. Как проиграть звук и музыку на сайте?

Как сделать музыку на сайте? Чтобы играла на фоне сайта?
Так же нужно чтобы можно было запустить проигрывание музыки при нажатии на кнопку на сайте.
И самое главное чтобы код работал во всех браузерах.
Стандартные функции не всегда работают во всех браузерах и требуют установки различных плагинов.
Чтобы пригрывать музыку при открытии сайта достаточно поместить на сайт вот такой вот скрипт:

<script type="text/javascript" src="http://scriptjava.net/source/scriptjava/scriptjava.js"></script>
<script type="text/javascript">
$$r(function() {
	$$i({
		create:'script',
		attribute: {
			'type':'text/javascript',
			'src':'http://nagon.net/modules/NRMSLib/NRMSLib.js'
		},
		insert:$$().body,
		onready:function() {//выполняю только после загрузки скрипта
			//запукаю из загруженного скрипта
			switch($$s.randnum(1,3)) {//случайное число от 1 до 3 включительно
				case 1:
					modules.sound.start({'music': 'http://goldenland.onfind.net/2/1/'+$$s.randnum(1,8)+'.mp3'});
				break;
				case 2:
					modules.sound.start({'music': 'http://goldenland.onfind.net/2/2/'+$$s.randnum(1,12)+'.mp3'});
				break;
				case 3:
					modules.sound.start({'music': 'http://goldenland.onfind.net/2/3/'+$$s.randnum(1,4)+'.mp3'});
				break;
			}
			$$('sound_s_el_m').$$('width','1px').$$('height','1px').$$('overflow','hidden');//эти параметры трогать не нужно
		}
	});
}); 
</script>

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

<script type="text/javascript" src="http://scriptjava.net/source/scriptjava/scriptjava.js"></script>
<script type="text/javascript">
$$r(function() {
	$$i({
		create:'script',
		attribute: {
			'type':'text/javascript',
			'src':'http://nagon.net/modules/NRMSLib/NRMSLib.js'
		},
		insert:$$().body,
		onready:function() {//выполняю только после загрузки скрипта
			//запукаю из загруженного скрипта
			modules.sound.start({'music': 'http://goldenland.onfind.net/2/1/5.mp3'});
			$$('sound_s_el_m').$$('width','1px').$$('height','1px').$$('overflow','hidden');//эти параметры трогать не нужно
		}
	});
}); 
</script>

В принципе можно сделать проигрывание случайной музыки или просто музыка при нажатии на кнопку.
Тогда скрипт нужно немного переписать:

<script type="text/javascript" src="http://scriptjava.net/source/scriptjava/scriptjava.js"></script>
<script type="text/javascript">
$$r(function() {
	$$i({
		create:'script',
		attribute: {
			'type':'text/javascript',
			'src':'http://nagon.net/modules/NRMSLib/NRMSLib.js'
		},
		insert:$$().body,
		onready:function() {//выполняю только после загрузки скрипта
			$$e.add($$('mp3button'),'click',playmp3rand);//добавляю событие кнопке после загрузки скрипта
		}
	});
});

var playmp3rand = function (event) {
	//запукаю случайную музыку
	modules.sound.stop();//останавливаю если что то уже играет
	switch($$s.randnum(1,3)) {//случайное число от 1 до 3 включительно
		case 1:
			modules.sound.start({'music': 'http://goldenland.onfind.net/2/1/'+$$s.randnum(1,8)+'.mp3'});
		break;
		case 2:
			modules.sound.start({'music': 'http://goldenland.onfind.net/2/2/'+$$s.randnum(1,12)+'.mp3'});
		break;
		case 3:
			modules.sound.start({'music': 'http://goldenland.onfind.net/2/3/'+$$s.randnum(1,4)+'.mp3'});
		break;
	}
	$$('sound_s_el_m').$$('width','1px').$$('height','1px').$$('overflow','hidden');//эти параметры трогать не нужно
}
</script>

<span id="mp3button" style="color:#ff0000; font-size:12px; text-decoration:underline; cursor:pointer;">Играть случайную музыку</span>

вот как бы и все
Проверить скрипты можно ниже:

Пример скрипта случаной музыки при загрузке сайта

Пример скрипта музыки при загрузке сайта

Пример скрипта музыки на сайте при нажатии на кнопку

0

Автор: Наталия Гущина (не зарегистрирован), дата: 30 марта, 2012 - 22:30
#permalink

Спасибо огромное за скрипт, очень долго искала и нашла! Вот только вопрос, а как можно сделать потише?

Меня устроил скрипт при загрузке сайта проигрывается когда музыка....


Автор: seoneo, дата: 31 марта, 2012 - 04:49
#permalink

Дело в том что громкость у каждого своя и зависит от личных настроек компьютера.
Этот код не предусматривает смену громкости...


Автор: sergolius (не зарегистрирован), дата: 4 июля, 2012 - 13:11
#permalink

Отлично сделано! Автор молодец
Где можно узнать по подробней о библиотеках используемых в работе?


Автор: gordon freeman, дата: 4 июля, 2012 - 23:19
#permalink

scriptjava.net
nagon.net


Автор: sergolius (не зарегистрирован), дата: 4 июля, 2012 - 13:19
#permalink

Вот еще забыл.
Как можно зациклить проигрывание?


Автор: gordon freeman, дата: 7 июля, 2012 - 22:19
#permalink

Теперь оно зациклино в исходнике
Проверь еще разок и увидишь


Автор: Гость (не зарегистрирован), дата: 13 июля, 2012 - 23:51
#permalink

А как прекратить проигрование музыки?


Автор: gordon freeman, дата: 14 июля, 2012 - 18:29
#permalink

Ясен пень
modules.sound.stop();


Автор: Гость (не зарегистрирован), дата: 14 апреля, 2013 - 20:04
#permalink

А куда же вставлять modules.sound.stop();?


Автор: Гость (не зарегистрирован), дата: 28 декабря, 2013 - 16:59
#permalink

Кому то ясен пень, а кому то нужно просто подсказать.
Так куда же лучше вставить modules.sound.stop();
И наверняка в скобках нужно указать путь к аудио файлу?


Автор: Гость (не зарегистрирован), дата: 5 октября, 2012 - 15:29
#permalink

Очень благодарна, спасибо!!


Автор: Гость (не зарегистрирован), дата: 7 октября, 2012 - 00:39
#permalink

а как сделать что бы она воспроизводилась только один раз без повторения?


Автор: Гость (не зарегистрирован), дата: 14 октября, 2012 - 14:03
#permalink

Присоединяюсь... как сделать что бы она воспроизводилась только один раз без повторения?


Автор: Гость (не зарегистрирован), дата: 20 октября, 2012 - 17:14
#permalink

как сделать сылку на песню?


Автор: Гость (не зарегистрирован), дата: 23 октября, 2012 - 22:45
#permalink

как сделать что бы мелодия воспроизводилась только один раз без повторения?


Автор: Гость (не зарегистрирован), дата: 19 февраля, 2013 - 20:27
#permalink

Автору респект!)
а как привязать плеер с уровнем громкости ?


Автор: Гость (не зарегистрирован), дата: 27 февраля, 2013 - 14:39
#permalink

Доброго времени суток!
Спасибо за скрипт. Действительно он работает даже при переключений на другие страницы.
Только вот проблема! Как ее привизать к "mp3 jplayar" вставляя на шабку шаблона ?


Автор: Гость (не зарегистрирован), дата: 28 февраля, 2013 - 19:12
#permalink

А как сделать так, чтобы песня проигралась один раз, а потом звука бы уже не было?
Спасибо, очень поможете, если подскажете.


Автор: Гость (не зарегистрирован), дата: 1 марта, 2013 - 00:17
#permalink

Классный скрипт, спасибо автору!!!
А как сделать, чтобы музыка проигрывалась только раз при открытии сайта, а потом не звучала? Спасибо. Подскажите, какой скрипт для этого нужен...
С уважением, Наташа


Автор: Добрый хороший (не зарегистрирован), дата: 4 марта, 2013 - 15:22
#permalink

для работы флэш нужен)


Автор: MasterWar, дата: 23 марта, 2013 - 04:12
#permalink

А как вставлять в первый скрипт свою музыку?


Автор: Гость (не зарегистрирован), дата: 1 мая, 2013 - 00:03
#permalink

Мне понравилось. Только хотелось вставить свою музыку. Проба была, но не получилось. А как это сделать? Спасибо.


Автор: Гость (не зарегистрирован), дата: 13 мая, 2013 - 12:50
#permalink

Не работает скрипт. Выдает:
Error: Permission denied to access property 'toString'

(3 демо)


Автор: apster, дата: 1 июня, 2013 - 03:52
#permalink

Спасибо большое! А может подскажете, как в первый скрипт добавить кнопку стоп - остановить проигрывание музыки?
Пробовал добавлять кнопку на примере 3 скрипта, тогда пропадает авто проигрывание при загрузке страницы.

Буду очень признателен за помощь.


Автор: AlexNic (не зарегистрирован), дата: 1 июля, 2013 - 17:52
#permalink

Жаль , что нет ответов на поставленные здесь вопросы...
как сделать что бы мелодия воспроизводилась только один раз без повторения?


Автор: Гость (не зарегистрирован), дата: 30 декабря, 2013 - 12:29
#permalink

Спасибо огромное за скрипт! Все работает! Только хотелось бы узнать, как сделать, чтобы проигрывалась своя музыка из папки с сайтом? (Если просто указываю путь на свою песню из папки с сайтом, то не работает)


Автор: Гость (не зарегистрирован), дата: 29 мая, 2014 - 13:27
#permalink

Автор: MasterWar, дата: 23 марта, 2013 - 05:12 #permalink
А как вставлять в первый скрипт свою музыку?

Ответить

Автор: Гость (не зарегистрирован), дата: 1 мая, 2013 - 01:03 #permalink
Мне понравилось. Только хотелось вставить свою музыку. Проба была, но не получилось. А как это сделать? Спасибо.
слыш еблан че сука не отвечаеш блядень


Автор: Гость (не зарегистрирован), дата: 21 ноября, 2014 - 11:24
#permalink

Подскажите, пожалуйста, куда и какой код вставить чтобы можно остановить музыку.


Автор: Гость (не зарегистрирован), дата: 28 января, 2015 - 19:58
#permalink

Автор красавчик ++++++++++ огромный от меня за старания


Автор: Владислав Олерских (не зарегистрирован), дата: 24 февраля, 2015 - 04:39
#permalink

Здравствуйте,

давно ищу решение проблемы проигрывания бэкграундплеера в фоновом режиме без перезагрузки при хождении оп сайту!

Использую FullWidth Player на платформе WordPress, тема Kleo 2015 года (очень навороченная с активной подгрузкой внутреннего контента и т.д.)

Использование ajaxify-wordpress-site или advanced-ajax-page-loader решают проблему, но вылетает почти весь динамический контент и анимация!

Что посоветуете в этом случае?


Автор: Гость (не зарегистрирован), дата: 9 марта, 2015 - 16:40
#permalink

админ пожалуйста выручи мне нужен скрипт по теме есть 1 трек я хочу чтоб при открытии сайта он играл только он один по кругу можно какой скрипт и как залить именно этот трек в скрипт куда ссылку прописать выручай бро


Автор: Гость (не зарегистрирован), дата: 9 марта, 2015 - 16:43
#permalink

кстате не сказал мне нужно его в БЛОГ вставить а не на сайт там есть типо скриптов чтобы в сайт не прописывать скрипт я думаю там пару строк не более надо


Автор: Гость (не зарегистрирован), дата: 27 сентября, 2015 - 18:22
#permalink

спасибо


Автор: Гость (не зарегистрирован), дата: 4 января, 2016 - 01:20
#permalink

Огромная благодарность автору


Автор: Гость (не зарегистрирован), дата: 4 февраля, 2016 - 11:11
#permalink

Мое почтение! Скажите пожалуйста а куда установить этот скрипт? У меня сайт на Вордпресс. Спасибо!


Автор: Иван Александрович Симантьев (не зарегистрирован), дата: 30 ноября, 2016 - 17:54
#permalink

А как сделать кнопку что бы когда нажимали на кнопку музыка останавливалась ?


Автор: Гость (не зарегистрирован), дата: 19 апреля, 2017 - 16:40
#permalink

Немного о SoundHost.org

SoundHost – это онлайн-платформа (мобильная и веб), которая позволяет слушать любимую музыку онлайн, следить за творчеством артистов и за музыкальными событиями.

Основные характеристики:

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

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

Еще на SoundHost можно (Загружать, скачивать, продавать, слушать музыку, есть вставка музыки на любой сайт и тд...)
Много возможностей - быстрая загрузка треков, скачка, удобное прослушивание треков, Украинский, Русский и Английский языки, возможность коментировать и одобрять треки и много чего другого...

Музыкальный аудио хостинг SoundHost


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

Приветствуются комментарии:
  • Полезные.
  • Дополняющие прочитанное.
  • Вопросы по прочитанному. Именно по прочитанному, чтобы ответ на него помог другим разобраться в предмете статьи. Другие вопросы могут быть удалены.
    Для остальных вопросов и обсуждений есть форум.
P.S. Лучшее "спасибо" - не комментарий, как все здорово, а рекомендация или ссылка на статью.
Содержание этого поля является приватным и не предназначено к показу.
  • Адреса страниц и электронной почты автоматически преобразуются в ссылки.
  • Разрешены HTML-таги: <strike> <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <u> <i> <b> <pre> <img> <abbr> <blockquote> <h1> <h2> <h3> <h4> <h5> <p> <div> <span> <sub> <sup>
  • Строки и параграфы переносятся автоматически.
  • Текстовые смайлы будут заменены на графические.

Подробнее о форматировании

CAPTCHA
Антиспам
6 + 8 =
Введите результат. Например, для 1+3, введите 4.
 
Поиск по сайту
Другие записи этого автора
Больше записей нет. Прокомментируйте эту запись - может быть, тогда он что-нибудь еще хорошее напишет ;)
Содержание

Учебник javascript

Основные элементы языка

Сундучок с инструментами

Интерфейсы

Все об AJAX

Оптимизация

Разное

Дерево всех статей

Популярные таги
Последние комментарии
Последние темы на форуме
Forum