Время для прочтения: 0 мин. 30 сек.
Июн
26

5 бесплатных HTML5 видео плееров для разработчика

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

MediaFront

Открытая бесплатная платформа (лицензия GPLv3) для внедрения плеера в веб-страницу, использует все новороты HTML5. Внедрение роликов с YouTube, Vimeo. Темы основаны на jQuery-UI ThemeRoller

Скачать

JME

jme — это HTML5 аудио/видео компонент с Flash и VLC Fallback, который сфокусирован на гибком интуитивно понятном DOM-API и семантичном коде.

Скачать

FlareVideo

Flare — бесплатный HTML 5 видео плеер. Темы основаны на CSS/HTML/JS. Полностью открытый исходный код. Бесплатен для коммерческого использования.

Скачать

Projekktor

Projekktor обертка для новых HTML5 аудио и видео элементов. Прост в интеграции (всего один JavaScript файл). Кроссбраузерный (IE, Opera, Chrome, Safari, Firefox и другие). Поддерживает внедрение рекламы в проигрываемый ролик.  Использует свободный видеокодек Theora. Есть плейлисты. Показ роликов с YouTube. Темы основаны на HTML/CSS. Бесплатен для некоммерческого и коммерческого использования (лицензия GNU GPL)

Скачать

Video JS

HTML5 видео плеер. Использует современные возможности браузеров. Бесплатен. Исходный код открыт. Легковесный. Не использует картинок. Скины задаются через CSS. Есть полноэкранный режим. В старых браузерах плеер автоматически заменяется на Flowplayer. Лицензия MIT.

Скачать

Связанные материалы

  1. Тестирование HTML5-видео на YouTube
  2. Аудио-видео проигрыватель для вашего сайта
  3. HTML5 замена Adobe Flash Player

← 
 →

Для вставки кода используйте HTML-теги
<pre><code class="php">ваш код</code></pre>

  • Рекомендую подробный урок по созданию своего видеоплеера с применением MediaElement.js http://siteacademy.ru/index.php/jquery/40-jquery/video-player

  • Шанди

    Я просто думаю. Ведь на любом устройстве уже есть свои плееры. Почему сайт не может передать файл туда чтобы играл как бы через встроенный плеер но внутри сайта.

  • Шанди

    Спасибо, сейчас попробую.

  • Шанди

    Кто знает плеер чтобы играли форматы mp3 mp4 flv без установки flash а только средствами html

  • Так дайте ваш XML посмотреть ))) Как же мы на расстоянии поможем. Проверьте валидатором ваш XML

  • Aleksov

    Вот ещё как вариант, универсальный HTML5 аудио / видео плеер http://set-pro.net/scr/ptmedia/

  • Ваня

    Подскажите, как мне подключить плеер Projekktor к своему сайту, я просто не нашел кода, для подключения.

    • Вот исчерпывающий пример интеграции с официального сайта проекта.

      • У меня также не захотел ставиться на blogspot. Эти скриты не идут для XML,
        выдаёт «Ошибка при синтаксическом анализе XML (строка 956, столбец 267): The entity name must immediately follow the ‘&’ in the entity reference.»
        Это вслучае с Projekktor, так что буду пробовать другое где не надо обновлять
        до jQuery JavaScript Library v1.4.2

        • Сделайте валидным XML — и будет вам счастье!

          • так о чём толкую то — не получается! я в XML не петрю и скопировать негде!

          • ладно чуваки вижу тут внятных ответов не дождёшся. придётся самому копать, как накопаю выложу тут ссылочку — где это лежит. до скорого!!!

  • Уважаемый есть пример как их на сайт ставить эти плееры ?? это плагины или что ?
    мне на вордпресс надо их поставить это возможно ??

    • Это HTML5 (Flash) плееры. На основе многих есть плагины для популярных CMS, в том числе и WordPress. Более подробную информацию можно узнать на сайте каждого из них. Обычно, достаточно в header-секции вашей страницы подключить файл стилей CSS и небольшую JS-библиотеку и обойтись без плагинов.

  • luff

    FlareVideo , я загрузил его на сайт и не знаю как указать — чтобы он показывал видео

  • luff

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

  • luff

    как добавить видео в плеер ?

    • На офсайте каждого из плееров есть полная документация и примеры внедрения в веб-страницу. Какой плеер вас интересует? Могу дать прямую ссылку на документацию.

  • Действительно многие новые теги HTML5 очень полезны, но их пока приходиться дублировать другими средствами с HTML4.