Video insertion?

1. The video tag can be used in normal MP4 format.

  <video src="http://www.huizhangongsi.com/video/acme.mp4" width="320" height="200"  controls   class="test2"></video>

2. Youku video insertion

<embed src="http://v.youku.com/v_show/id_XMzU4NzMxODY2NA==.html?spm=a2h3j.8428770.3416059.1" class="test" style="overflow:hidden;"

quality="high" width="320" height="230" align="center" allowScriptAccess="always" allowFullScreen="true" mode="transparent" ></embed>

3.flv format insertion

a.<!-- flv format-->

<div id="video"></div>

b.<script type="text/javascript">

var video1 = new Video({
// required, selector
wrapper: '#video',
// optional, default width: 600
width: 680,
// optional, default height: 350
height: 350,

// Required, the path is placed at the same level as flvplayer.swf
Name: '0425small.flv',
// Optional, the video player path, the default path 'media/flvplayer.swf'
swfdir: 'flvswf/flvplayer.swf',

// Optional, the default configuration item, the configuration parameters of flvplayer.swf player are passed in in the following format
// For the description of configurable parameters, please refer to http://blog.csdn.net/joyhen/article/details/23001487
swfparam: ' &IsAutoPlay=1&IsContinue=1&BarPosition=3&BarTransparent=40&IsShowBar=3',

// Optional, the flash loading error callback function, if not configured, use the default operation
flashLoadError: function(){ }
});
</script>

c. Introduce jquery.videoswf.js

/**
* v1.0.0
* video-swf, video playback plugin
* Component dependencies: jquery1.7.2+
*/
(function(){

var $ video;

function Video(opts){
this._opts = opts || {};
this._opts.wrapper = opts.wrapper;
this._opts.width = opts.width || 600;
this._opts.height = opts.height || 350;
this._opts.name = opts.name;
this._opts.swfdir = opts.swfdir || 'media/flvplayer.swf';
this._opts.swfparam = opts.swfparam || '&IsAutoPlay=1&IsContinue=1&BarPosition=3&BarTransparent=40&IsShowBar=3';
this._opts.flashLoadError = opts.flashLoadError;
this._init(this._opts);
}

Video.prototype = {
// Friendly prompt flash information
_addFlashTips: function(str){
// General prompt to install or update flash prompt
var html = '<div class="video-tip"><p>'+str+'Please You <a href="http://www.adobe.com/go/getflashplayer" target="_blank">install now</a></p></div>';
return html;
},
// flash Check
_flashChecker: function(){
var hasFlash = 0; //whether flash is installed
var flashVersion = 0; //flash version
if (document.all) {
var swf = new ActiveXObject('ShockwaveFlash.ShockwaveFlash');
if (swf ) {
hasFlash = 1;
VSwf = swf.GetVariable("$version");
flashVersion = parseInt(VSwf.split(" ")[1].split(",")[0]);
}
} else {
if (navigator.plugins && navigator.plugins.length > 0) {
var swf = navigator.plugins["Shockwave Flash"];
if (swf) {
hasFlash = 1;
var words = swf.description.split(" ");
for (var i = 0; i < words.length; ++i) {
if (isNaN(parseInt(words[i]))) continue;
flashVersion = parseInt(words[i]);
}
}
}
}
return {
f: hasFlash,
v: flashVersion
};
},
// 视频配置
_flashObj: function(o) {
return '<embed width="' + o.width + 'px" height="' + o.height + 'px" loop="true" ' +
'title="" wmode="transparent" '+
'src="' + o.swfdir+'' + '" ' +
'allowfullscreen="true" ' +
'flashvars="vcastr_file=' + o.name + o.swfparam +''+
'&quality="high" ' +
'pluginspage="http://get.adobe.com/cn/flashplayer" ' + //http://www.macromedia.com/go/getflashplayer
'type="application/x-shockwave-flash">';
},
_init: function(args){
var _this = this;
var videohtml;
var obj = {
width: args.width,
height: args.height,
name: args.name,
swfdir: args.swfdir,
swfparam: args.swfparam
};
var fls = _this._flashChecker();
$video = $(args.wrapper);
if(fls.f && fls.v > 20){
videohtml = _this._flashObj(obj);
}else if(fls.f &&fls.v < 20){
if($.isFunction(_this._opts.flashLoadError)){
videohtml = _this._addFlashTips("Master~You have installed flash, the current flash version is too low~~");
}else{
_this._opts.flashLoadError();
}
}else{
if($.isFunction(_this._opts.flashLoadError)){
videohtml = _this._addFlashTips("Master~You don't have flash installed~~");
}else{
_this._opts.flashLoadError();
}
}
$video .append(videohtml);
}
};

window.Video = Video;
})();

 d. Put the video in flv format and the inserted video in the same folder as flvswf

Flvplayer.swf download

e. Xiaomi phones do not support flash

 

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=325610315&siteId=291194637