搜索:
向播放器添加插件
增加功能
使用说明
插件制作示例
监听动作插件
修改右键
修改/增加右键菜单
修改,添加右键

网页跟播放器交互函数,JSAPI控制函数列表

涉及到本教程的相关收费视频教程如下:

在控制栏上添加一个按钮,实现自定义的功能(价格:¥5.00)

制作一个试看功能-本功能只支持在PC端上使用(价格:¥8.00)

在查阅该文之前需要了解的内容如下:

播放器和网页进行交互的相关说明

网页跟播放器交互函数,JSAPI演示示例

正文:
videoPlay()
支持环境:html5,flashplayer
功能说明:播放
函数说明:该函数同时可控制播放器跳过前置广告,插入广告,暂停广告
videoPause()
支持环境:html5,flashplayer
功能说明:暂停
函数说明:
playOrPause()
支持环境:html5,flashplayer
功能说明:在播放和暂停二个状态之间切换
函数说明:
videoMute()
支持环境:html5,flashplayer
功能说明:静音
函数说明:
videoMute()
支持环境:html5,flashplayer
功能说明:取消静音
函数说明:
changeVolume(volume)
支持环境:html5,flashplayer
功能说明:改变音量
函数说明:volume指音量,类型是:Number,范围是:0-1
videoSeek(time)
支持环境:html5,flashplayer
功能说明:跳转指定时间点
函数说明:time指时间点,类型是:Int,单位:秒
changeControlBarShow(show)
支持环境:html5,flashplayer
功能说明:是否显示控制栏
函数说明:show=false时控制栏隐藏,必需手动控制显示才可以继续恢复原的效果
addListener(name,function)
支持环境:html5,flashplayer
功能说明:添加监听
函数说明:name=事件名称,function=监听函数
removeListener(name,function)
支持环境:html5,flashplayer
功能说明:删除监听
函数说明:name=事件名称,function=监听函数
videoClear()
支持环境:flashplayer
功能说明:清除视频
函数说明:这个功能基本属性无用的功能,可以不必考虑该函数的使用。
getMetaDate()
支持环境:html5,flashplayer
功能说明:获取元数据
函数说明:返回一个对象,包含视频的元数据信息+播放器的相关信息。返回的主要信息如下:
总时间:duration,单位:秒
音量:volume,范围0-1
播放器的宽度:width
播放器的高度:height
视频宽度:videoWidth
视频高度:videoHeight
视频原始宽度:streamWidth
视频原始高度:streamHeight
是否暂停状态:paused
---------------------------------------------
在flashplayer里还有以下一些常用的元数据信息
总加载量:bytesTotal
addElement(obj)
支持环境:html5,flashplayer
功能说明:添加一个元件到播放器中
函数说明:简单示例:var elementTemp = player.addElement(Object);,返回元件(名称)
传递的变量是一个对象,该对象里可以定义元件的内容。支持和内容有:文本,普通图片(png,jpg,jpeg),gif图片,swf。
以下是一个简单的示例:
var attribute = {
	list: [ //list=定义元素列表
		{
			type: 'gif', //定义元素类型:只有二种类型,image=使用图片,text=文本
			file: 'screenshot/gif.gif', //图片地址
			radius: 30, //图片圆角弧度
			width: 30, //定义图片宽,必需要定义
			height: 30, //定义图片高,必需要定义
			alpha: 0.9, //图片透明度(0-1)
			marginLeft: 10, //图片离左边的距离
			marginRight: 10, //图片离右边的距离
			marginTop: 10, //图片离上边的距离
			marginBottom: 10, //图片离下边的距离
			clickEvent: "link->http://www.ckplayer.com"
		 }, 
		 {
			type: 'text', //说明是文本
			text: '演示弹幕内容,弹幕只支持普通文本,不支持HTML', //文本内容
			color: '0xFFDD00', //文本颜色
			size: 14, //文本字体大小,单位:px
			font: '"Microsoft YaHei", YaHei, "微软雅黑",', //字体
			leading: 30, //文字行距
			alpha: 1, //文本透明度(0-1)
			paddingLeft: 10, //文本内左边距离
			paddingRight: 10, //文本内右边距离
			paddingTop: 0, //文本内上边的距离
			paddingBottom: 0, //文本内下边的距离
			marginLeft: 0, //文本离左边的距离
			marginRight: 10, //文本离右边的距离
			marginTop: 10, //文本离上边的距离
			marginBottom: 0, //文本离下边的距离
			backgroundColor: '0xFF0000', //文本的背景颜色
			backAlpha: 0.5, //文本的背景透明度(0-1)
			backRadius: 30, //文本的背景圆角弧度
			clickEvent: "actionScript->videoPlay"
		 }
		],
		x: 10, //元件x轴坐标,注意,如果定义了position就没有必要定义x,y的值了,支持数字和百分比
		y: 50, //元件y轴坐标
		//position:[1,1],//位置[x轴对齐方式(0=左,1=中,2=右),y轴对齐方式(0=上,1=中,2=下)
		alpha: 1, //元件的透明度
		backgroundColor: '0xFFDD00', //元件的背景色
		backAlpha: 0.5, //元件的背景透明度(0-1)
		backRadius: 60, //元件的背景圆角弧度
		clickEvent: "actionScript->videoPlay"
	}
var elementTemp = player.addElement(attribute);
deleteElement(name)
支持环境:html5,flashplayer
功能说明:删除元件
函数说明:示例,删除addElement()函数新建的元件:
deleteElement(elementTemp);
getElement()
支持环境:html5,flashplayer
功能说明:获取元件
函数说明:以上面的示例:var dm=getElement(elementTemp);
animate(obj)
支持环境:html5,flashplayer
功能说明:元件缓动
函数说明:让一个元件进行缓动。示例:
var obj = {
	element: elementTemp,//元件(名称)
	parameter: 'x',//缓动类型,x=方向,y=方向,alpha=透明度
	static: true, //是否禁止其它属性,true=是,当一个属性变化时,其它的不变
	effect: 'None.easeOut',//缓动名称+类型
	start: null,//开始位置,设置成null,则以当前的位置开始
	end: 0,//结束位置
	speed: 10,//缓动频率
	overStop: true,//鼠标经过元件时是否暂停缓动
	pauseStop: true,//视频暂停时是否暂停缓动
	callBack: 'deleteChild'//缓动结束时调用的js函数
};
var danmuAnimate = player.animate(obj);
缓动的类型共有3种:easeIn,easeOut,easeInOut
缓动的名称共有11种:None,Quadratic,Cubic,Quartic,Quintic,Sine,Exponential,Circular,Elastic,Back,Bounce
videoRotation(rotation)
支持环境:flashplayer
功能说明:旋转视频
函数说明:

                        rotation指角度,类型是:Number,仅支持:0,90,270,360,-90,-270
另外还可以设置成:1,顺时针旋转、-1,逆时针旋转

videoZoom(zoom)
支持环境:flashplayer
功能说明:改变尺寸比例
函数说明:zoom的默认值是:1,类型:Int,proportion的值必需大于等于0,当小于1时缩小,大于1时放大,比如1.1将增加10%的大小
videoProportion(proportion)
支持环境:flashplayer
功能说明:改变宽高比例
函数说明:proportion的默认值是:(1,1),示例:调整成4:3的则是:videoProportion(4,3)
videoBrightness(n)
支持环境:flashplayer
功能说明:调整亮度
函数说明:设置亮度值,值的大小在-255和255之间,0为中间值,小于0则变暗,大于0则变亮
videoContrast(n)
支持环境:flashplayer
功能说明:调整对比度
函数说明:设置对比度值,值的大小在-255和255之间,127.5为中间值,小于127.5则偏暗,大于127.5则对比鲜明
videoSaturation(n)
支持环境:flashplayer
功能说明:调整饱和度
函数说明:设置饱和度值,值的大小在-255和255之间,1为中间值,0则切换成黑白照片
videoHue(n)
支持环境:flashplayer
功能说明:调整色相
函数说明:设置色相值,值的大小在-255和255之间,0为中间值
screenshot(object,save,name)
支持环境:flashplayer
功能说明:截图功能
函数说明:object=截屏对象,分成二种:字符类型,video=视频截图,player=播放器截图。save=是否需要保存示,类型:布尔型,true=需要保存,false=不需要保存。name=保存时的名称。例:screenshot('video',false,'视频截图'),如果不保存,则需要一个函数来监听图片数据。另外,需要截图的功能的视频需要在当前播放器域下有全部权限
changeConfig(..arg,value)
支持环境:flashplayer
功能说明:修改所有外部传递的数据
函数说明:示例:要修改flashplayer里的autoplay(默认播放暂停)    
changeConfig('flashvars','autoplay',true);    
示例:修改config的autoload    
changeConfig('config','autoload',false);    
getConfig(...arg)
支持环境:flashplayer
功能说明:获取所有外部传递的数据
函数说明:示例:获取config里的autoload    
getConfig('config','autoload')    
示例:获取config的值    
getConfig('config')    
newVideo(obj)
支持环境:html5,flashplayer
功能说明:改变当前的播放地址及相关值
函数说明:示例:    
newVideo({autoplay:true,video:'newvideo.mp4'});    
custom(...arg,value)
支持环境:flashplayer
功能说明:控制自定义元件的显示与隐藏
函数说明:控制播放器上的自定义元件的示例:
custom('swf','swfName',true)    
控制控制栏上的自定义元件的示例:    
custom('controlBar','swf','swfName',true)    
quitFullScreen()
支持环境:html5,flashplayer
功能说明:退出全屏
函数说明:
openUrl(url,obj)
支持环境:flashplayer
功能说明:打开一个网址
函数说明:示例:
openUrl('http://www.ckplayer.com','_blank')
changePlaybackRate(n)
支持环境:html5
功能说明:改变播放速度
函数说明:支持的值:0,1,2,3
建议了解以下相关内容:

网页跟播放器交互函数,JSAPI监听函数列表

Powered by ckplayer.com
Copyright©ckplayer,2011-2017( 苏ICP备11026158号 )