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

Концепция

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

Скачать v1.3 ß (19 января 2013 г.)

Видео

MP4 — .h364/AAC

Аудио

MP3AAC

Простой путь

Инициализация

В блоке <head></head> подключите последнюю версию джейквериdmplayer.1.3.min.js, dmp_controls.js, dmp_style.css.

Примерный код:

<html>
	<head>
		<link rel="stylesheet" type="text/css" href="dmplayer.1.3/dmp_style.css" media="all" />
		<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
		<script type="text/javascript" src="dmplayer.1.3/dmplayer.1.3.min.js"></script>
		<script type="text/javascript" src="dmplayer.1.3/dmp_controls.js"></script>
	</head>
	<body>
	</body>
</html>

В блок <body></body> для видео добавляете следующую конструкцию:

<div class="video_player">
	<a href="/video.mp4"><img src="/poster.jpg" width="426" height="240" /></a>
</div>

Для картинки надо обязательно указать ширину и высоту — таких размеров будет размещён плеер.

Вариант для аудио:

<div class="audio_player">
	<a href="/02_subject_beautiful.mp3">Phoneheads — Subject Beautiful</a>
</div>

Сложный путь

Инициализация

В блоке <head></head> подключите последнюю версию джейквери и dmplayer.1.3.min.js.

В блок <body></body> добавьте пустой <div class="myplayer"></div>.

Примерный код:

<html>
	<head>
		<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
		<script type="text/javascript" src="dmplayer.1.3.min.js"></script>
	</head>
	<body>
		<div class="myplayer"></div>
	</body>
</html>

Далее инициализация (пример для видео):

$(function ()
{
	var player = $('div.myplayer').dmplayer({
		playerPath : 'dmplayer.1.3/dmplayer.1.3.swf',
		filePath   : 'movie.mp4',
		posterPath : 'poster.jpg',
		width      : 640,
		height     : 320
	});
});

Опции

Опции при инициализации передаются в виде массива {option1: value1, option2: value2}. Включают в себя обязательные для инициализации и колбеки.

Обязательные опции для видео и аудио

playerPath

Путь к файлу dmplayer.1.3.swf. Используется для воспроизведения медиа на десктоп-браузерах.

filePath

Путь к воспроизводимому файлу.

Обязательные опции только для видео

posterPath

Путь к постеру — показывается до воспроизведения видео.

width

Ширина выводимого блока. Используются только целочисленные значения. Проценты использовать нельзя.

height

Высота выводимого блока. Значиния тоже только целочисленные.

Необязательные опции

bgColor

Цвет фона в формате #HEX. По умолчанию значение #000000.

touchFullScreen

При значении true добавляется жест «на весь экран» для тач-интерфейсов. По умолчанию значение false.

defaultControls

При значении true добавляются дефолтные контролы для тач-интерфейсов. По умолчанию значение false.

Колбеки

onInitial

Выполняется при инициализации плеера.

onPlay

Воспроизведение началось.

onPause

Воспроизведение приостановлено.

onEnded

Воспроизведение закончилось.

onBuffered

Загрузка в память закончилась.

onPlaying

Выполняется каждые 250 миллисекунд с момента начала воспроизведения и до окончания воспроизведения. Во время паузы событие не вызывается.

onBuffering

Выполняется каждые 250 миллисекунд с момента начала воспроизведения и до окончания загрузки.

АПИ

Получить состояние

getPlaying

Возвращает true, если идёт воспроизведение.

getBuffering

Возвращает true, если ролик ещё загружается.

getCurrentTime

Возвращает воспроизведённое время в секундах.

getCurrentTimeH

Возвращает воспроизведённое время в формате ЧЧ:ММ:СС.

getDuration

Возвращает длительность в секундах.

getDurationH

Возвращает длительность в формате ЧЧ:ММ:СС.

getBuffered

Возвращает количество загруженного ролика в секундах.

getBufferedH

Возвращает количество загруженного ролика в формате ЧЧ:ММ:СС.

getRemainingTime

Возвращает оставшееся для воспроизведение время в секундах.

getRemainingTimeH

Возвращает оставшееся для воспроизведение время в формате ЧЧ:ММ:СС.

getVolume

Возвращает значение громкости от 0 до 1.

Управление воспроизведением

play

Воспроизвести. Если параметр не передаётся, то воспроизведение идёт либо с начала, либо с момента остановки воспроизведения. Команда .play(30) начнёт воспроизведение с 30 секунды.

playNext

Воспроизвести следующий трек.

playPrevious

Воспроизвести предыдущий трек.

pause

Приостановить.

togglePlay

Если ролик воспроизводится, то будет приостановлен и наоборот.

volume

Выставить громкость. Принимает значения от 0 до 1. Команда .volume(0.5) выставит половину громкости.

pauseAll

Приостановить все плееры на странице. Полезная функция, при организации плей-листов.

setWidthHeight

Функция для изменения размера видео. Принимает два целочисленных параметра width и height. Пример использования: .setWidthHeight(640, 320)

showPoster

Показать постер во время воспроизведения.

hidePoster

Скрыть постер.

© 2012...2014 Алексей Чикин и Сергей Глазков • По всем вопросам пишите: mail@dmplayer.ru