视频插入？

最新推荐文章于 2022-04-18 22:37:23 发布

weixin_33973609

最新推荐文章于 2022-04-18 22:37:23 发布

阅读量116

点赞数

原文链接：http://www.cnblogs.com/duanzhange/p/9003613.html

版权

1.正常MP4格式的用video标签即可。

2.优酷视频插入

3.flv格式插入

a.

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

var video1 = new Video({
// 必填，选择器
wrapper: '#video',
// 可选，默认宽度：600
width: 680,
// 可选，默认高度：350
height: 350,

// 必填，路径放置和flvplayer.swf同级
name: '0425small.flv',
// 可选，视频播放器路径，默认路径'media/flvplayer.swf'
swfdir: 'flvswf/flvplayer.swf',

// 可选，默认配置项，flvplayer.swf播放器的配置参数按如下格式传入
// 可配置的参数说明参考http://blog.csdn.net/joyhen/article/details/23001487
swfparam: '&IsAutoPlay=1&IsContinue=1&BarPosition=3&BarTransparent=40&IsShowBar=3',

// 可选，flash加载出错的回调函数，不配置则使用默认的操作
flashLoadError: function(){ }
});
</script>

c.引入jquery.videoswf.js

/**
* v1.0.0
* video-swf，视频播放插件
* 组件依赖：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 = {
// 友好提示flash的信息
_addFlashTips: function(str){
// 一般提示安装或者更新flash提示
var html = '<div class="video-tip"><p>'+str+'请您<a href="http://www.adobe.com/go/getflashplayer" target="_blank">立即安装</a></p></div>';
return html;
},
// flash检测
_flashChecker: function(){
var hasFlash = 0;　　　　 //是否安装了flash
var flashVersion = 0;　　 //flash版本
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("主人~您安装了flash,当前flash版本太低~~");
}else{
_this._opts.flashLoadError();
}
}else{
if($.isFunction(_this._opts.flashLoadError)){
videohtml = _this._addFlashTips("主人~您没有安装flash~~");
}else{
_this._opts.flashLoadError();
}
}
$video.append(videohtml);
}
};