Audio Player на HTML5 и CSS3 для uCoz
827материалов
228тем на форуме
3004комментария
6157пользователей

Audio Player на HTML5 и CSS3 для uCoz


Введение:

Ранее для воспроизведения произвольного аудио в браузере использовали преимущественно Adobe Flash или другие плагины браузера. И благодаря одной из интересных и самых ожидаемых функций HTML5 элемент <audio> появилась возможность воспроизведения аудио в пределах браузера, облегчает воспроизведение вашего аудио-материала онлайн. Вместо того, чтобы тратить время на исследование данной возможности, предлагаем вам сообщение, в котором расскажем вам о лучших HTML5 аудио плееры для сайтов, которые находятся в свободном доступе для использования.

Описание плеера:

  • 1) Аудио плеер адаптивен под все популярные устройства;
  • 2) Плеер имеет два вида запуска: по нажатию и автозапуск;
  • 3) Аудио плеер очень легкий и не нагружает Ваш сайт
  • 4) Плеер полностью бесплатный;
  • 5) Самое главное, что он легко настраиваем, даже "блондинка" поймет что к чему.
Установка:

Скачиваем архив с нашего сайта и папку MP3 загружаете свой файловый менеджер

Для начала подключаем стили (CSS) перед </head>:
Код
<link rel="stylesheet" href="/mp3/APlayer.min.css">

Далее подключаем кнопку аудио плеера:
Код
<div id="player" class="aplayer">
<div style="padding: 10px; font-size: 10px; text-align: center;"></div>
</div>

Теперь перед </body> вставляем код:
Код
<script src="/mp3/APlayer.min.js"></script>

Песня запускается при включении:
Код
<script>
var ap = new APlayer({
element: document.getElementById('player'),
narrow: true,
autoplay: false,
music: {
title: 'Исполнитель песни',
author: 'Название песни',
url: 'Ссылка на mp3 файл',
pic: 'Ссылка на постер песни'
}
});
ap.init();
</script>

Автозапуск песни:
Код
<script>
var ap = new APlayer({
element: document.getElementById('player'),
narrow: false,
autoplay: true,
music: {
title: 'Исполнитель песни',
author: 'Название песни',
url: 'Ссылка на mp3 файл',
pic: 'Ссылка на постер песни'
}
});
ap.init();
</script>

Настройки:

  • title: 'Исполнитель песни',
  • author: 'Название песни',
  • url: 'Ссылка на mp3 файл',
  • pic: 'Ссылка на постер песни'

ПОСМОТРЕТЬ ДЕМО ЗАКАЗАТЬ УСТАНОВКУ

Скрипт опубликовал:
...
Логин на сайте: ...
Группа: ...
Статус: ...
Информация о скрипте:
Дата добавления материала: 18.01.2016 в 19:00
Материал просмотрен: 2490 раз
Категория материала: Скрипты для uCoz
К материалу оставлено: 18 комментариев

Пожаловаться
Сказать спасибо
Источник

18 комментариев


Русский
Спасибо. Очень классный плеер, беру себе
Ромчик
Не за что
maks@@@
Ну наконец-то нормальный плеер для UCOZ !
Урааааа!
Спасибо! like like like like like
maks@@@
Слушай Ром , кое-что подметил на твоем сайте!
Так как я захожу с ВК , хотел бы спросить
А ты можешь сделать на сайте заход через вк , а то каждый раз надо заходить в како-нибудь материал
И заходить где коментарии!
Или мож чего не знаю о вашем сайт?
Ромчик
У меня стоит uID авторизация
♡Alienware♡
Player хороший: но почему в браузере уран не воспроизводится песня? A в остольных браузерах всё норм работает .
Ромчик
Roman Nikolaevich @Ромчик 27.11.2015 12:119
+1
С браузером были ранешь проблемы. Вам надо удалить и скачать новую версию http://browsers.ucoz.ru
♡Alienware♡
ok. понятно спасибо.
1 2 »
avatar
Вход через социальные сети
Работа в компании uCoz
uSocial - социальные кнопки
uLike – кнопка «Мне нравится»
Статистики нашего сайта