» »

Аудио-плеер с плейлистом на HTML5

Аудио-плеер с плейлистом на HTML5

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

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

При открытие и выбора музыки:

Красивый музыкальный плеер


Рассмотрим особенности:

1. Легкий в использовании
2. Поддержка плейлиста
3. Изображение на заднем плане
4. Обложка альбома
5. Регулятор громкости
6. Функции для случайного и повторного воспроизведения композиций
7. Работает на всех популярных браузерах
8. Работает в Android и IOS

Если решите добавить свою композицию, то вам поставить в файл index.html, что предоставлен ниже.

Код
{  
  "title": "This Is What You Came For",  
  "author": "Calvin Harris",  
  "cover": "files/covers/2.jpg",  
  "background": "files/backgrounds/2.jpg",  
  "pfile": "files/music/2.mp3",  
  "duration": "221"  
},


Чтоб понять, что за какие формы отвечает.

"title": - Название композиции
"author": - Исполнитель
"cover": - Обложка альбома
"background": - Задний фон
"pfile": - Ссылка на .mp3 файл
"duration": - Продолжительность композиции в секундах.


Источник: art-ucoz.ru
2017-06-22 Загрузок: 86 Просмотров: 4303 Комментарий: (30)

Поделиться в социальных сетях

Материал разместил

Комментарий: 30
tsakonter
tsakonter 2017-06-23 00:111
0
Что так много весит он, это какой то ансамбль со своими балалайками.)
Kosten
Kosten 2017-06-23 01:282
0
Самому не известно, что так весит, но если посмотреть но демонстраций, то если видел несколько плееров такого рода, то этот безусловно лидер.
-SAM-
-SAM- 2017-06-23 03:293
+1
Там особо думать не о чём, в папке files\music - лежат mp3-композиции, которые просто для примера.
Kosten
Kosten 2017-06-23 04:114
0
Как важное дополнение в основной материал перенес.
tsakonter
tsakonter 2017-06-24 17:215
0
Но можно вообще сделать радио на сайт и только одну тему музыкальную оставить, но это все к тематическим относиться.
Critic©
Critic© 2017-06-25 23:116
0
Классный плеер респект автору!
Critic©
Critic© 2017-08-06 19:227
0
Спасибо за плеер! Хорошо вписался в дизайн сайта
Kosten
Kosten 2017-08-06 20:108
0
Но тут мне по этому плееру хорошо помогли, так под музыкальные сайты, что если добавление, то под какого то артиста или композитора, будет вообще хорошо.
nikolajnowichihin
nikolajnowichihin 2017-11-18 10:359
0
Всем привет как установить плеер на сайт помогите пожалуйста.
Kosten
Kosten 2017-11-18 15:1810
0
Скачать и залить плеер, хотя его не когда не устанавливал, только на демонстраций видел, но как понимаю в архиве находится несколько вариантов.
Kashirina
Kashirina 2018-01-30 13:1013
0
Зачем тогда заливать не проверенные материалы..? Что-бы было? ))
Kosten
Kosten 2018-01-30 13:1214
0
Почему не проверенный, возможно изначально не был проверен и из демонстраций делал вывод, но потом ставили его.
Webmaster32
Webmaster32 2018-01-30 16:2716
0
У меня всё работает, ссылка для проверки, проверяйте ссылки на файлы чтобы пути совпадали
1 2 3 »
avatar