Выполните следующие простые шаги, чтобы встроить фильм с помощью Flowplayer ( видеоплеер с открытым исходным кодом). Есть куча настроек, которые вы можете сделать для плеера, о которых я расскажу в отдельных постах более подробно — включая поддержку ipad, настраиваемые элементы управления, прямую трансляцию RTMP / RTSP, автоматическое воспроизведение, масштабирование клипов, отладку плеера, изменение разрешения, изменение разрешения, динамическое видео размер и т. д. В этом посте подробно описана минимальная настройка проигрывателя для начала работы.
Похожие сообщения:
HTML
Status Ready.
JQuery
//video or stream address var streamAddressFull = "http://streamaddress/mp4:filename/playlist.m3u8", vidElem = $('#fms'), statusElem = $('#video-stream-status .status'); $f('fms', "http://releases.flowplayer.org/swf/flowplayer-3.2.7.swf", { /** ------- Error Handling -------- **/ debug: debug, //output all events triggered by the Flash component to the console onError: function(e) { statusElem.html("Error: (code:"+e+")."); }, // we need at least this version of flash version: [9, 115], // older versions will see a custom message onFail: function() { statusElem.html("You need the latest Flash version to view MP4 movies. " + "Your version is " + this.getVersion()); }, onBeforeLoad:function() { statusElem.html("Loading..."); }, /** ------- Clip Configurations -------- **/ clip: { url: streamAddressFull, scaling: 'fit', //fit, scale, orig, half autoPlay: true, autoBuffering: true, onStart: function(clip) { statusElem.html("Playing."); } }, plugins: { controls: { // display properties such as size, location and opacity right: 0, bottom: 0, opacity: 0.95, backgroundGradient: 'low', //faded slightly } }, /** ------- Look and Feel -------- **/ canvas: { backgroundGradient: 'none', backgroundColor: '#000000' } });.//video or stream address var streamAddressFull = "http://streamaddress/mp4:filename/playlist.m3u8", vidElem = $('#fms'), statusElem = $('#video-stream-status .status'); $f('fms', "http://releases.flowplayer.org/swf/flowplayer-3.2.7.swf", { /** ------- Error Handling -------- **/ debug: debug, //output all events triggered by the Flash component to the console onError: function(e) { statusElem.html("Error: (code:"+e+")."); }, // we need at least this version of flash version: [9, 115], // older versions will see a custom message onFail: function() { statusElem.html("You need the latest Flash version to view MP4 movies. " + "Your version is " + this.getVersion()); }, onBeforeLoad:function() { statusElem.html("Loading..."); }, /** ------- Clip Configurations -------- **/ clip: { url: streamAddressFull, scaling: 'fit', //fit, scale, orig, half autoPlay: true, autoBuffering: true, onStart: function(clip) { statusElem.html("Playing."); } }, plugins: { controls: { // display properties such as size, location and opacity right: 0, bottom: 0, opacity: 0.95, backgroundGradient: 'low', //faded slightly } }, /** ------- Look and Feel -------- **/ canvas: { backgroundGradient: 'none', backgroundColor: '#000000' } });