`

网页视频播放方案-jaris flv player和ckplayer

 
阅读更多

一、两者的共同点:

1、都能播放flv、mp4、mp3格式的视频、音频文件。
2、都能设置视频载入前的展示图片。
3、都能满足常规需求。

二、不同点:

1、jaris player完全免费,简单,无绑定内容,完全能够满足一般用户需求。
2、ckplayer定制化程度高,国产,支持视频前多个广告,支持自定义皮肤。但是不完全免费,可以用于商业用途,需要保留其logo和初始载入动画。

三、jaris player

官网:jarisflvplayer.org

(一)支持两种页面:

1、播放栏在右:


2、播放栏在下:


(二)参数表:

source logoalpha
This is the actual path of the media that is going to be played. The transparency percent. values permitted 1 to 100
type logowidth
The type of file to play, allowable values are:audio,video. The width in pixels of the logo.
streamtype logolink
The stream type of the file, allowable values are:file,http,rmtp,youtube A link to a webpage when the logo is click
server hardwarescaling
Used in coordination with rtmp stream servers. Enable or disable hardware scaling on fullscreen mode, values: false or true
duration controls
Total times in seconds for input media or formatted string in the format hh:mm:ss To disable the displaying of controls, values: false to hide otherwise defaults to show
poster darkcolor
Screenshot of the video that is displayed before playing. The darker color of player controls
aspectratio brightcolor
To override original aspect ratio on first time player load. Allowable values: 1:1, 3:2, 4:3, 5:4, 14:9, 14:10, 16:9, 16:10 The bright color of player controls
autostart controlcolor
A true or false value that indicates to the player if it should auto play the video on load. The face color of controls
logo hovercolor
An image of your logo. On mouse hover color for controls
logoposition jsapi
The position of the logo in the player, permitted values are: top left, top right, bottom left and bottom right Expose events to javascript functions and enable controlling the player from the outside. Set to any value to enable.
loop
Makes the player repeat the playback after it has finished. Set to true or 1

(三)快捷键:

SPACE LEFT
Play or pause video.
Rewind
TAB RIGHT
Switch between different aspect ratios. Foward
UP M
Raise volume Mute or unmute volume.
DOWN F
Lower volume
Switch to fullscreen mode

(四)demo:

js控制:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <title>Jaris FLV Player测试</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="language" content="en"/>
    <meta name="description" content=""/>
    <meta name="keywords" content=""/>
    <script src="./js/swfobject.js" type="text/javascript"></script>
    <script src="../js-lib/common.js" type="text/javascript"></script>
    <script type="text/javascript">
        var flashvarsVideo = {
//            source: getContentPath() + "/videos/ad.mp4", // 播放的视频文件地址
            source: getContentPath() + "/resources/swf/20140424160605219.swf",
            type: "video", // 文件格式,支持两种格式:audio, video
            streamtype: "file", // 文件流类型:file, http, rmtp, youtube
            server: "", // streamtype为rmtp时使用,协调rmtp文件流的服务器地址
            duration: "52",
            poster:"images/zjl.jpg", // 视频封面图片
            autostart: "false", // 自动开始播放
            logo: "logo.png", // 视频播放画面的logo
            logoposition: "bottom right", // logo的位置:top bottom right left
            logoalpha: "30", // logo的透明度
            logowidth: "130", // logo的宽度
            logolink: "http://www.baidu.com", // logo点击后连接地址
            hardwarescaling: "false",
            darkcolor: "000000", // 播放画面的背景颜色
            brightcolor: "4c4c4c", // 播放页面前景色
            controlcolor: "FFFFFF", // 工具栏的颜色
            hovercolor: "67A8C1", // 鼠标移动到工具栏按钮上的颜色
            controltype: 1 // 控制类型:0 - 老版本样式,播放控制在右边,1-新版本样式,播放控制在下边
        };
        var params = {
            menu: "false",
            scale: "noScale",
            allowFullscreen: "false", //是否允许全屏播放
            allowScriptAccess: "always",
            bgcolor: "#000000", // 播放背景色
            quality: "high", //视频画面质量:high low
            wmode: "opaque"
        };
        var attributes = {
            id: "JarisFLVPlayer"
        };
        swfobject.embedSWF("JarisFLVPlayer.swf", "altContentOne", "576px", "360px", "10.0.0", "expressInstall.swf", flashvarsVideo, params, attributes);
    </script>
    <style>
        html, body {
            height: 100%;
        }

        body {
            margin: 0;
        }
    </style>
</head>
<body>
<br/>
<center>
    <h1>明明就</h1>

    <div id="altContentOne">
        <h1>Jaris FLV Player</h1>

        <p>Alternative content</p>

        <p><a href="http://www.adobe.com/go/getflashplayer"><img
                src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif"
                alt="Get Adobe Flash player"/></a></p>
    </div>
</center>
</body>
</html>

html<object>标签控制:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
    <title>Demo: New Player Controls - Jaris FLV Player</title>
    <!-- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="generator" content="JarisCMS - Copyright JegoYalu.com. All rights reserved." />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <link rel="alternate" title="RSS - Jaris FLV Player" href="http://jarisflvplayer.org/rss" type="application/rss+xml">
    <meta name="alexaVerifyID" content="tQJ4nEQk7DQlBuqPvWmdO6OdJ08" />
     -->
    <!-- <link href="http://jarisflvplayer.org/styles/00-system.css" rel="stylesheet" type="text/css" media="all"/>
    <link href="http://jarisflvplayer.org/themes/jarisplayerv2/style.css" rel="stylesheet" type="text/css" media="all"/> -->
    <!-- <link rel="shortcut icon" type="image/ico" href="http://jarisflvplayer.org/favicon.ico" />  -->
    <!-- <script type="text/JavaScript" src="http://jarisflvplayer.org/themes/jarisplayerv2/curvycorners.js"></script> -->
    <!--<script type="text/JavaScript">
        curvyCorners.addEvent(window, 'load', initCorners);
        function initCorners() {
            var settings = {
                tl: { radius: 10 },
                tr: { radius: 10 },
                bl: { radius: 10 },
                br: { radius: 10 },
                antiAlias: true
            }

            var settings_menu = {
                tl: { radius: 4 },
                tr: { radius: 4 },
                bl: { radius: 4 },
                br: { radius: 4 },
                antiAlias: true
            }
            curvyCorners(settings, "#content-container");
            curvyCorners(settings_menu, "#header .menu");
        }

    </script>-->
    <!--
    <script type="text/javascript" src="http://jarisflvplayer.org/scripts/00-jquery-1.4.2.min.js"></script>
    -->
    <!--<script type="text/javascript" src="http://jarisflvplayer.org/scripts/00-jquery-1.8.2.min.js"></script>-->
    <!--
    <script type="text/javascript"
            src="http://jarisflvplayer.org/scripts/01-jquery.textarearesizer.compressed.js"></script>
    <script type="text/javascript" src="http://jarisflvplayer.org/scripts/02-system.js"></script>
    -->
    <script src="../js-lib/common.js" type="text/javascript"></script>
</head>

<body>
<div id="content-container">
    <table id="content">
        <tr>
            <td class="center">
                <!--<h1>Demo: New Player Controls</h1>

                <div id="tabs-menu">
                    <ul class="tabs tabs-2">
                        <li class="first"><span><a href="http://jarisflvplayer.org/demo">Old Controls</a></span></li>
                        <li class="first"><span><a class="selected" href="http://jarisflvplayer.org/demo/new-controls">New
                            Controls</a></span></li>
                    </ul>
                    <div class="clear tabs-clear"></div>
                </div>-->

                <div class="content">
                    <table>
                        <tr>
                            <td class="content">
                                <p style="font-size: 16px">
                                    You can give the player the look that better suits your taste with the feature of
                                    custom color controls.
                                </p>

                                <hr style="border: 0; border-bottom: dotted 2px #d3d3d3"/>
                                <h2>Original colors</h2>

                                <div class="block">
                                    <center>
                                        <object
                                                classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
                                                codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,45,2"
                                                width="576" height="360"
                                                >
                                            <!--<param name="allowFullscreen" value="false">
                                            <param name="allowScriptAccess" value="always">
                                            <param name="movie" value="JarisFLVPlayer.swf"/>
                                            <param name="bgcolor" value="#000000">
                                            <param name="quality" value="high">
                                            <param name="scale" value="noscale">
                                            <param name="wmode" value="opaque">
                                            <!–<param name="flashvars"
                                                   value="source=http://jaris.sourceforge.net/files/jaris-intro.flv&type=video&duration=52&streamtype=file&poster=http://jarisflvplayer.org/images/poster.png&autostart=false&logo=http://jarisflvplayer.org/images/logo.png&logoposition=top left&logoalpha=30&logowidth=130&logolink=http://jaris.sourceforge.net&hardwarescaling=false&darkcolor=000000&brightcolor=4c4c4c&controlcolor=FFFFFF&hovercolor=67A8C1&controltype=1">–>

                                            <param name="flashvars"
                                                   value="source=videos/af.mp4&type=video&duration=52&streamtype=file&poster=http://jarisflvplayer.org/images/poster.png&autostart=false&logo=http://jarisflvplayer.org/images/logo.png&logoposition=top left&logoalpha=30&logowidth=130&logolink=http://jaris.sourceforge.net&hardwarescaling=false&darkcolor=000000&brightcolor=4c4c4c&controlcolor=FFFFFF&hovercolor=67A8C1&controltype=1">

                                            <param name="seamlesstabbing" value="false">-->
                                            <embed
                                                    type="application/x-shockwave-flash"
                                                    pluginspage="http://www.adobe.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"
                                                    width="576" height="360"
                                                    src="JarisFLVPlayer.swf"
                                                    allowfullscreen="true"
                                                    allowscriptaccess="always"
                                                    bgcolor="#000000"
                                                    quality="high"
                                                    scale="noscale"
                                                    wmode="opaque"
                                                    flashvars="source=/exam/videos/ad.mp4&type=video&duration=52&streamtype=file&poster=images/zjl.jpg&autostart=true&logo=logo.png&logoposition=top left&logoalpha=30&logowidth=130&logolink=logo.png&hardwarescaling=false&controltype=1"
                                                    seamlesstabbing="false"
                                                    menu="false"
                                                    >
                                                <noembed>
                                                </noembed>
                                            </embed>
                                        </object>
                                    </center>
                                </div>

                                <h2>White tones</h2>

                                <div class="block">
                                    <center>
                                        <object
                                                classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
                                                codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,45,2"
                                                width="576" height="360"
                                                >
                                            <param name="allowFullscreen" value="true">
                                            <param name="allowScriptAccess" value="always">
                                            <param name="movie"
                                                   value="http://jarisflvplayer.org/files/JarisFLVPlayer.swf">
                                            <param name="bgcolor" value="#000000">
                                            <param name="quality" value="high">
                                            <param name="scale" value="noscale">
                                            <param name="wmode" value="opaque">
                                            <param name="flashvars"
                                                   value="source=http://jaris.sourceforge.net/files/jaris-intro.flv&type=video&duration=52&streamtype=file&poster=http://jarisflvplayer.org/images/poster.png&autostart=false&logo=http://jarisflvplayer.org/images/logo.png&logoposition=top left&logoalpha=30&logowidth=130&logolink=http://jaris.sourceforge.net&hardwarescaling=false&darkcolor=D3D3D3&brightcolor=FFFFFF&controlcolor=000000&hovercolor=FF0000&controltype=1&seekcolor=000000">
                                            <param name="seamlesstabbing" value="false">
                                            <embed
                                                    type="application/x-shockwave-flash"
                                                    pluginspage="http://www.adobe.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"
                                                    width="576" height="360"
                                                    src="http://jarisflvplayer.org/files/JarisFLVPlayer.swf"
                                                    allowfullscreen="true"
                                                    allowscriptaccess="always"
                                                    bgcolor="#000000"
                                                    quality="high"
                                                    scale="noscale"
                                                    wmode="opaque"
                                                    flashvars="source=http://jaris.sourceforge.net/files/jaris-intro.flv&type=video&duration=52&streamtype=file&poster=http://jarisflvplayer.org/images/poster.png&autostart=false&logo=http://jarisflvplayer.org/images/logo.png&logoposition=top left&logoalpha=30&logowidth=130&logolink=http://jaris.sourceforge.net&hardwarescaling=false&darkcolor=D3D3D3&brightcolor=FFFFFF&controlcolor=000000&hovercolor=FF0000&controltype=1&seekcolor=000000"
                                                    seamlesstabbing="false"
                                                    >
                                                <noembed>
                                                </noembed>
                                            </embed>
                                        </object>
                                    </center>
                                </div>

                                <h2>Blue tones</h2>

                                <div class="block">
                                    <center>
                                        <object
                                                classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
                                                codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=10,0,45,2"
                                                width="576" height="360"
                                                >
                                            <param name="allowFullscreen" value="true">
                                            <param name="allowScriptAccess" value="always">
                                            <param name="movie"
                                                   value="http://jarisflvplayer.org/files/JarisFLVPlayer.swf">
                                            <param name="bgcolor" value="#000000">
                                            <param name="quality" value="high">
                                            <param name="scale" value="noscale">
                                            <param name="wmode" value="opaque">
                                            <param name="flashvars"
                                                   value="source=http://jaris.sourceforge.net/files/jaris-intro.flv&type=video&duration=52&streamtype=file&poster=http://jarisflvplayer.org/images/poster.png&autostart=false&logo=http://jarisflvplayer.org/images/logo.png&logoposition=top left&logoalpha=30&logowidth=130&logolink=http://jaris.sourceforge.net&hardwarescaling=false&darkcolor=004F9D&brightcolor=008FD5&controlcolor=000000&hovercolor=FFFFFF&controltype=1&seekcolor=FFFFFF">
                                            <param name="seamlesstabbing" value="false">
                                            <embed
                                                    type="application/x-shockwave-flash"
                                                    pluginspage="http://www.adobe.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"
                                                    width="576" height="360"
                                                    src="http://jarisflvplayer.org/files/JarisFLVPlayer.swf"
                                                    allowfullscreen="true"
                                                    allowscriptaccess="always"
                                                    bgcolor="#000000"
                                                    quality="high"
                                                    scale="noscale"
                                                    wmode="opaque"
                                                    flashvars="source=http://jaris.sourceforge.net/files/jaris-intro.flv&type=video&duration=52&streamtype=file&poster=http://jarisflvplayer.org/images/poster.png&autostart=false&logo=http://jarisflvplayer.org/images/logo.png&logoposition=top left&logoalpha=30&logowidth=130&logolink=http://jaris.sourceforge.net&hardwarescaling=false&darkcolor=004F9D&brightcolor=008FD5&controlcolor=000000&hovercolor=FFFFFF&controltype=1&seekcolor=FFFFFF"
                                                    seamlesstabbing="false"
                                                    >
                                                <noembed>
                                                </noembed>
                                            </embed>
                                        </object>
                                    </center>
                                </div>
                            </td>
                        </tr>
                    </table>
                </div>
            </td>
        </tr>
    </table>
</div>
</body>

</html>

四、ckplayer


官网:www.ckplayer.com

demo:

最简单的demo:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>ckplayer简单调用演示</title>

    <script type="text/javascript" src="js/offlights.js"></script>
</head>

<body>
<div id="video" style="position:relative;z-index: 100;width:600px;height:400px;float: left;">
    <div id="a1"></div>
</div>

<script type="text/javascript" src="ckplayer/ckplayer.js" charset="utf-8"></script>
<script type="text/javascript">
    var flashvars = {
        f: '/exam/videos/af.flv',
        c: 0,
        b: 1
    };
    var params = {bgcolor: '#FFF', allowFullScreen: true, allowScriptAccess: 'always'};
    CKobject.embedSWF('ckplayer/ckplayer.swf', 'a1', 'ckplayer_a1', '600', '400', flashvars, params);
    /*
     CKobject.embedSWF(播放器路径,容器id,播放器id/name,播放器宽,播放器高,flashvars的值,其它定义也可省略);
     下面三行是调用html5播放器用到的
     */
    var video = ['http://movie.ks.js.cn/flv/other/1_0.mp4->video/mp4', 'http://www.ckplayer.com/webm/0.webm->video/webm', 'http://www.ckplayer.com/webm/0.ogv->video/ogg'];
    var support = ['iPad', 'iPhone', 'ios', 'android+false', 'msie10+false'];
    CKobject.embedHTML5('video', 'ckplayer_a1', 600, 400, video, flashvars, support);
</script>
</body>
</html>

官方demo及详细参数说明:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>ckplayer</title>
<style type="text/css">
body,td,th {
	font-size: 14px;
	line-height: 26px;
}
body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}
p {
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-left: 10px;
}
</style>
<script type="text/javascript" src="js/offlights.js"></script>
</head>

<body>
<div id="video" style="position:relative;z-index: 100;width:600px;height:400px;float: left;"><div id="a1"></div></div>
<!--
上面一行是播放器所在的容器名称,如果只调用flash播放器,可以只用<div id="a1"></div>
-->
<textarea name="statusvalue" rows="15" id="statusvalue" style="width:200px;height:400px;">该处是用来监听播放器实时返回的各种状态,可以根据这里的状态实时的控制播放器</textarea>
<textarea name="obj" rows="15" id="obj" style="width:200px;height:400px;">这里是主动获取播放器里的各项状态值</textarea>
<script type="text/javascript" src="ckplayer/ckplayer.js" charset="utf-8"></script>
<script type="text/javascript">
	//如果你不需要某项设置,可以直接删除,注意var flashvars的最后一个值后面不能有逗号
	var flashvars={
		f:'http://movie.ks.js.cn/flv/other/1_0.flv',//视频地址
		a:'',//调用时的参数,只有当s>0的时候有效
		s:'0',//调用方式,0=普通方法(f=视频地址),1=网址形式,2=xml形式,3=swf形式(s>0时f=网址,配合a来完成对地址的组装)
		c:'0',//是否读取文本配置,0不是,1是
		x:'',//调用xml风格路径,为空的话将使用ckplayer.js的配置
		i:'http://www.ckplayer.com/images/loadimg3.jpg',//初始图片地址
		d:'http://www.ckplayer.com/down/pause6.1_1.swf|http://www.ckplayer.com/down/pause6.1_2.swf',//暂停时播放的广告,swf/图片,多个用竖线隔开,图片要加链接地址,没有的时候留空就行
		u:'',//暂停时如果是图片的话,加个链接地址
		l:'http://www.ckplayer.com/down/adv6.1_1.swf|http://www.ckplayer.com/down/adv6.1_2.swf',//前置广告,swf/图片/视频,多个用竖线隔开,图片和视频要加链接地址
		r:'',//前置广告的链接地址,多个用竖线隔开,没有的留空
		t:'10|10',//视频开始前播放swf/图片时的时间,多个用竖线隔开
		y:'',//这里是使用网址形式调用广告地址时使用,前提是要设置l的值为空
		z:'http://www.ckplayer.com/down/buffer.swf',//缓冲广告,只能放一个,swf格式
		e:'3',//视频结束后的动作,0是调用js函数,1是循环播放,2是暂停播放并且不调用广告,3是调用视频推荐列表的插件,4是清除视频流并调用js功能和1差不多,5是暂停播放并且调用暂停广告
		v:'80',//默认音量,0-100之间
		p:'0',//视频默认0是暂停,1是播放
		h:'0',//播放http视频流时采用何种拖动方法,=0不使用任意拖动,=1是使用按关键帧,=2是按时间点,=3是自动判断按什么(如果视频格式是.mp4就按关键帧,.flv就按关键时间),=4也是自动判断(只要包含字符mp4就按mp4来,只要包含字符flv就按flv来)
		q:'',//视频流拖动时参考函数,默认是start
		m:'0',//默认是否采用点击播放按钮后再加载视频,0不是,1是,设置成1时不要有前置广告
		o:'',//当m=1时,可以设置视频的时间,单位,秒
		w:'',//当m=1时,可以设置视频的总字节数
		g:'',//视频直接g秒开始播放
		j:'',//视频提前j秒结束
		k:'30|60',//提示点时间,如 30|60鼠标经过进度栏30秒,60秒会提示n指定的相应的文字
		n:'这是提示点的功能,如果不需要删除n和j的值|提示点测试60秒',//提示点文字,跟k配合使用,如 提示点1|提示点2
		wh:'',//这是6.2新增加的宽高比,可以自己定义视频的宽高或宽高比如:wh:'4:3',或wh:'1080:720'
		ct:'2',//6.2新增加的参数,主要针对有些视频拖动时时间出错的修正参数,默认是2,自动修正,1是强制修正,0是强制不修正
		//调用播放器的所有参数列表结束
		//以下为自定义的播放器参数用来在插件里引用的
		my_url:encodeURIComponent(window.location.href)//本页面地址
		//调用自定义播放器参数结束
		};
	var params={bgcolor:'#FFF',allowFullScreen:true,allowScriptAccess:'always'};//这里定义播放器的其它参数如背景色(跟flashvars中的b不同),是否支持全屏,是否支持交互
	var attributes={id:'ckplayer_a1',name:'ckplayer_a1',menu:'false'};
	//下面一行是调用播放器了,括号里的参数含义:(播放器文件,要显示在的div容器,宽,高,需要flash的版本,当用户没有该版本的提示,加载初始化参数,加载设置参数如背景,加载attributes参数,主要用来设置播放器的id)
	swfobject.embedSWF('ckplayer/ckplayer.swf', 'a1', '600', '400', '10.0.0','ckplayer/expressInstall.swf', flashvars, params, attributes);
	/*播放器地址,容器id,宽,高,需要flash插件的版本,flashvars,params,attributes
	  如果你因为目前的swfobject和你项目中的存在冲突,不想用swfobject.embedSWF调用,也可以用如下代码进行调用
	  CKobject.embedSWF('ckplayer/ckplayer.swf','a1','ckplayer_a1','600','400',flashvars,params);
	  CKobject.embedSWF(播放器路径,容器id,播放器id/name,播放器宽,播放器高,flashvars的值,其它定义也可省略);
	  此时可以删除ckplayer.js中的最后一行,交互的部分也要改成CKobject.getObjectById('ckplayer_a1')
	*/
	//调用ckplayer的flash播放器结束
	/*
	下面三行是调用html5播放器用到的
	var video='视频地址和类型';
	var support='支持的平台或浏览器内核名称';	
	*/
	var video=['http://movie.ks.js.cn/flv/other/1_0.mp4->video/mp4','http://www.ckplayer.com/webm/0.webm->video/webm','http://www.ckplayer.com/webm/0.ogv->video/ogg'];
	var support=['iPad','iPhone','ios','android+false','msie10+false'];//默认的在ipad,iphone,ios设备中用html5播放,android,ie10上没有安装flash的也调用html5
	CKobject.embedHTML5('video','ckplayer_a1',600,400,video,flashvars,support);
	/*
	如果不想使用html5播放器,只要把上面三行去掉就可以了
	=================================================================
	以下代码并不是播放器里的,只是播放器应用时用到的
	=================================================================
	*/
	function playerstop(){
		//只有当调用视频播放器时设置e=0或4时会有效果
		alert('播放完成');	
	}
	var _nn=0;//用来计算实时监听的条数的,超过100条记录就要删除,不然会消耗内存
	var watt=false;
	function ckplayer_status(str){
		_nn+=1;
		if(_nn>200){
			_nn=0;
			document.getElementById('statusvalue').value='';
		}
		document.getElementById('statusvalue').value=str+'\n'+document.getElementById('statusvalue').value;
		if(str=='video:play'){
			if(!watt){
				watt=true;
				setInterval('getstart()',1000);
			}
		}

	}
	function getstart(){
		var a=swfobject.getObjectById('ckplayer_a1').ckplayer_getstatus();
		var ss='';
		for (var k in a){
			ss+=k+":"+a[k]+'\n';
		}
		document.getElementById('obj').innerHTML=ss;
	}
	function aboutstr(str,f){//查看str字符里是否有f
		var about=false;
		var strarray=new Array();
		var farray=new Array();
		farray=f.split(",");
		if(str){
			for(var i=0;i<farray.length;i++){
				strarray=str.split(farray[i]);
				if(strarray.length>1){
					about=true;
					break;
				}
			}
		}
		return about;
	}
	function ckadjump(){
		alert('你点击了跳过广告按钮,注册成为本站会员,可不用观看前置广告');
	}
	//开关灯
	var box = new LightBox();
	function closelights(){//关灯
		box.Show();
		CKobject._K_('video').style.width='940px';
		CKobject._K_('video').style.height='550px';
		swfobject.getObjectById('ckplayer_a1').width=940;
		swfobject.getObjectById('ckplayer_a1').height=550;
	}
	function openlights(){//开灯
		box.Close();
		CKobject._K_('video').style.width='600px';
		CKobject._K_('video').style.height='400px';
		swfobject.getObjectById('ckplayer_a1').width=600;
		swfobject.getObjectById('ckplayer_a1').height=400;
	}
  </script>
<p style="color:#F00">
ckplayer6.3,<a href="help.htm" target="_blank">查看升级说明</a><br />
<strong><a href="http://www.ckplayer.com/" target="_blank">官网</a>,<a href="http://www.ckplayer.com/manual.php" target="_blank">帮助手册</a></strong><br />
<strong>如果你是双击打开该页面,发现不能播放视频</strong>(原则上该播放器需要在网站环境中运行),<a href="http://www.ckplayer.com/bbs/forum.php?mod=viewthread&tid=942">请点击该链接查看设置方法</a></p>
<p>以下的操作类只对flash播放器有效</p>
<p>
  <input type="button" name="button" id="button" value="暂停前置广告" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_advpause();" />
  <input type="button" name="button" id="button" value="继续播放前置广告" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_advpause(false);" />
  <input type="button" name="button" id="button" value="跳过广告" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_advunload();" />
  <input type="button" name="button" id="button" value="隐藏控制栏" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_changeface(true);" />
  <input type="button" name="button" id="button" value="显示控制栏" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_changeface();" />
  <input type="button" name="button" id="button" value="播放" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_play();" />
  <input type="button" name="button" id="button" value="暂停" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_pause();" />
  <input type="button" name="button" id="button" value="播放/暂停" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_playorpause();" />
  <input type="button" name="button" id="button" value="快进" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_fastnext();" />
  <input type="button" name="button" id="button" value="快退" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_fastback();" />
  <input type="button" name="button2" id="button2" value="显示调整插件" onClick="swfobject.getObjectById('ckplayer_a1').ckplayer_plugin('adjustment.swf',true);" />
  <input type="button" name="button2" id="button2" value="隐藏调整插件" onClick="swfobject.getObjectById('ckplayer_a1').ckplayer_plugin('adjustment.swf',false);" />
  <input type="button" name="button2" id="button2" value="清除视频" onClick="swfobject.getObjectById('ckplayer_a1').ckplayer_videoclear();" />
</p>
<p>
  先设置好要跳转的秒数:
  <input name="seconds" type="text" id="seconds" value="20" size="5" maxlength="5" />
  <input type="button" name="button" id="button" value="跳转" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_seek(document.getElementById('seconds').value);" />
</p>
<p>
  先设置好音量(1-100):
  <input name="volume" type="text" id="volume" value="20" size="5" maxlength="5" />
  <input type="button" name="button" id="button" value="设置" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_volume(document.getElementById('volume').value);" />
</p>
<p>
  亮度(-255-255):
  <input name="brightness" type="text" id="brightness" value="200" size="5" maxlength="5" />
  <input type="button" name="button" id="button" value="设置" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_brightness(document.getElementById('brightness').value);" />
0为中间值,向右为亮向左为暗</p>
<p>
  对比度(-255-255):
  <input name="contrast" type="text" id="contrast" value="200" size="5" maxlength="5" />
  <input type="button" name="button" id="button" value="设置" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_contrast(document.getElementById('contrast').value);" />
127.5为中间值,向右对比鲜明向左对比偏暗</p>
<p>
  饱和度(-255-255):
  <input name="saturation" type="text" id="saturation" value="200" size="5" maxlength="5" />
  <input type="button" name="button" id="button" value="设置" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_saturation(document.getElementById('saturation').value);" />
1为中间值,0为灰度值(即黑白相片)</p>
<p>
  色相(-255-255):
  <input name="sethue" type="text" id="sethue" value="200" size="5" maxlength="5" />
  <input type="button" name="button" id="button" value="设置" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_sethue(document.getElementById('sethue').value);" />
0为中间值,向右向左一试便知</p>
<p>
  增加宽高:
    <input name="wandh" type="text" id="wandh" value="100" size="5" maxlength="5" /><input name="wandh2" type="text" id="wandh2" value="100" size="5" maxlength="5" />
  <input type="button" name="button" id="button" value="设置" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_wandh(document.getElementById('wandh').value,document.getElementById('wandh2').value);" /> 
  大于0,100为正常宽高
</p>
<p>
  自由设置宽:
    <input name="cw" type="text" id="cw" value="100" size="5" maxlength="5" />
    高:
    <input name="ch" type="text" id="ch" value="100" size="5" maxlength="5" />
    x:
    <input name="cx" type="text" id="cx" value="100" size="5" maxlength="5" />
    y:
    <input name="cy" type="text" id="cy" value="100" size="5" maxlength="5" />
  <input type="button" name="button" id="button" value="设置" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_whxy(document.getElementById('cw').value,document.getElementById('ch').value,document.getElementById('cx').value,document.getElementById('cy').value);" />
</p>
<p>
  播放新参数地址:
  <input name="newaddress" type="text" id="newaddress" value="{f->http://movie.ks.js.cn/flv/2012/02/6-1.flv}" size="60" maxlength="100" />
  <input type="button" name="button" id="button" value="跳转" onclick="swfobject.getObjectById('ckplayer_a1').ckplayer_newaddress(document.getElementById('newaddress').value);" />
</p>
<p>以下是CKoject函数所能做的一些跟播放器无关的事情</p>
<p id="aboutme"></p>
<script type="text/javascript">
var aboutme='';
aboutme+='平台(浏览器)内核:'+CKobject.Platform()+'<br />';
aboutme+='浏览器:'+CKobject.browser()['B']+'<br />';
aboutme+='浏览器版本:'+CKobject.browser()['V']+'<br />';
aboutme+='是否安装了flash插件:'+CKobject.Flash()['f']+'<br />';
if(CKobject.Flash()['f']){
	aboutme+='flash插件版本:'+CKobject.Flash()['v']+'<br />';
}
CKobject._K_('aboutme').innerHTML=aboutme;
</script>

</body>
</html>

参考:
http://jarisflvplayer.org/demo/new-controls
http://www.ckplayer.com/nview.php?id=160




分享到:
评论

相关推荐

    jaris flv player本地文件播放、网络媒体文件播放、rtmp流播放示例

    Jaris flv player官方网站只给出了网络音视频文件播放的示例,对于初次接触网页播放器的开发人员,配对本地音视频文件播放、rtmp流媒体播放比较困难,网上相关介绍资料很少,需要跟踪源码、追根溯源才能正确配置。...

    restclient-ui-3.2.2-jar-with-dependencies

    这个版本号表明它是RESTClient的3.2.2迭代,且“jar-with-dependencies”意味着这是一个Java Archive (JAR) 文件,集成了项目的所有依赖,便于用户一次性下载和使用。 在进行API开发、测试或调试时,RESTClient提供...

    ksoap2-android-assembly-2.6.5-jar-with-dependencies.jar

    ksoap2-android-assembly-2.6.5-jar-with-dependencies.jar 要是需要最新的,下载地址: http://code.google.com/p/ksoap2-android/

    PCMPlayer.jar

    一款基于java的简单pcm播放器,一行命令解决pcm播放问题:java -jar "PCMPlayer.jar的路径",如:java -jar D:\PCMPlayer.jar D:\test.pcm 当前只支持:16k采样率,16位、单声道、有符号,小端序音频。我平常只是拿...

    Packaging Utility for Jaris FLV Player-开源

    这是一个Windows应用程序,将Jaris FLV Player的组件(http://jaris.sourceforge.net)以及用户创建的FLV视频文件,可选的徽标和缩略图以及自动生成HTML文件打包在zip压缩文件中。

    Java-WebSocket-jar

    Java-WebSocket jar包,封装WebSocket实现。

    mybatis-3.4.1- jar包

    这个JAR文件包含了MyBatis框架的所有核心类和资源,使得开发者可以在项目中引入并使用MyBatis的功能。 MyBatis的核心功能包括: 1. **SQL映射**:MyBatis允许在XML或者注解中编写SQL语句,这些SQL语句可以与Java...

    ksoap2-android-assembly-3.6.2-jar-with-dependencies.jar

    最新版ksoap2,官网下载

    commons-dbcp-1.4.jar和commons-pool-1.5.6.jar

    这两个JAR文件,`commons-dbcp-1.4.jar` 和 `commons-pool-1.5.6.jar`,在Java应用中起到了重要的角色,特别是对于那些需要高效管理数据库连接的大型系统。 Apache Commons DBCP是Apache Commons项目的一部分,它...

    easypoi-jar包

    easypoi-jar包

    commons-beanutils-1.8.0 jar包下载

    commons-beanutils-1.8.0 jar包: 1.commons-beanutils-1.8.0.jar 2.commons-beanutils-1.8.0-javadoc.jar 3.commons-beanutils-1.8.0-sources.jar 4.commons-beanutils-bean-collections-1.8.0.jar 5.commons-...

    java视频开发jffmpeg-1.1.0.jar

    java视频开发jffmpeg-1.1.0.jar

    cors-filter-1.7.jar 和 java-property-utils-1.9.jar

    `cors-filter-1.7.jar` 和 `java-property-utils-1.9.jar` 是在Java环境中实现CORS跨域访问时常用的两个库。`cors-filter-1.7.jar` 包含了一个过滤器,该过滤器能够处理HTTP请求头,允许跨域请求通过。而`java-...

    maven jar包

    maven-jar-plugin-2.4.jar maven-model-3.2.1-sources.jar maven-model-builder-3.2.1-sources.jar maven-osgi-0.1.0.jar maven-osgi-0.2.0.jar maven-plugin-annotations-3.1.jar maven-plugin-api-3.2.1-sources....

    netty-4.1.4-jar包

    netty-4.1.4-jar包

    xwork各版本的jar包

    xwork-1.1.1.jar, xwork-1.1.jar, xwork-1.2.1.jar, xwork-1.2.3.jar, xwork-2.0.0.jar, xwork-2.0.1.jar, xwork-2.0.3.jar, xwork-2.0.4.jar, xwork-2.0.5.jar, xwork-2.0.6.jar, xwork-2.0.7.jar, xwork-2.1.0.jar...

    commons-pool-1.3.jar 和commons-dbcp-1.2.2.jar

    标题中的"commons-pool-1.3.jar"和"commons-dbcp-1.2.2.jar"是两个在Java开发中常用的开源库,主要用于数据库连接池管理。它们都是Apache Commons项目的一部分,旨在提高数据库访问效率,减少数据库资源的消耗。 ...

    commons-beanutils-1.8.2.jar,commons-codec-1.4.jar

    commons-beanutils-1.8.2.jar,commons-codec-1.4.jar,commons-collections-3.2.1.jar,commons-dbcp-1.2.2.jar,commons-digester-2.0.jar,commons-fileupload-1.2.1.jar,commons-httpclient.jar,commons-io-...

    plexus jar包

    plexus-archiver-1.0-alpha-7.jar plexus-build-api-0.0.4.jar plexus-cipher-1.7-sources.jar plexus-classworlds-2.5.1-sources.jar plexus-compiler-api-1.9.1.jar plexus-compiler-api-2.2.jar plexus-compiler-...

    json-jar包

    jackson-xc-1.8.3.jar jackson-mapper-asl-1.9.2.jar jackson-core-asl-1.9.2.jar jackson-jaxrs-1.8.3.jar json-lib-2.4-jdk15.jar

Global site tag (gtag.js) - Google Analytics