在做网站中有时候我们需要在网页中嵌入视频,一般视频嵌入有以下几种方法:

1. 优酷代码嵌入

优点:简单,方便,可靠。

缺点:有广告,现在的网站非常注重用户体验,如果打开一个在线视频是有长广告的一定会崩溃的。

2. 利用<object>标签嵌入视频

优点:也比较方便,对于swf来说不错。

缺点:如果播放的是wmv格式,利用Chrome打开就搞笑了,有时候会提示你安装media player插件,有时候连个提醒都没有。也就是说跨浏览器的能力不足。

不同的视频格式还有不一样的代码,太繁琐。

3. 利用<video>标签

优点:HTML5新标签,对于手机端来说不错

缺点:HTML5<video>标签只支持三种格式,还有编码要求。另外如果要实现视频控制,如:播放尺寸,色彩,播放拖曳还得另外写js代码。

4. 利用第三方播放插件CKplayer

优点:支持大多数浏览器,还有视频控制,分享,开关灯,插入广告等等设置。如果你是js大牛还可以自行各种修改功能

缺点:我实测下来支持ckplayer最好的格式是经过H.264编码的MP4格式视频。其他的格式或多或少有些小问题。

官网地址:http://www.ckplayer.com

注意点:嵌入代码前务必下载ckplayer相关文件夹并将其放在根目录下

嵌入代码:

<div id="a1"></div>
<script type="text/javascript" src="ckplayer/ckplayer.js" charset="utf-8"></script>
<script type="text/javascript">
var flashvars = {
f: '/Movie/123.mp4',
c: ,
loaded: 'loadedHandler'
};
var video = ['http://movie.ks.js.cn/flv/other/1_0.mp4->video/mp4'];
CKobject.embed('ckplayer/ckplayer.swf', 'a1', 'ckplayer_a1', '', '', false, flashvars, video);
</script>

f:这里需要填入你的视频地址;

注意src地址的正确性以及embed中第一项swf地址的正确性。

如果不想在页面中暴露本地视频的地址,可以采用:

想要去掉调整,分享,开关灯设置可以:

想修改播放器正中间的LOGO(载入播放器时会出现),以及播放器右上角的LOGO可以:

更多的功能大家可以自行到官网查看开发手册。我用的就是这么多功能。希望能给那些该用什么代码在网站中嵌入视频而烦恼的码农一个方向。

使用CKplayer插件在网页中嵌入视频的方法(常用笔记2)的更多相关文章

  1. 【CKplayer】使用CKplayer插件在网页中嵌入视频的方法

    在做网站中有时候我们需要在网页中嵌入视频,一般视频嵌入有以下几种方法: 1. 优酷代码嵌入 优点:简单,方便,可靠. 缺点:有广告,现在的网站非常注重用户体验,如果打开一个在线视频是有长广告的一定会崩 ...

  2. 使用JWPlayer在网页中嵌入视频

    首发:个人博客,持续更新和纠错 我一直以为在网页中嵌入视频是件复杂的事,一研究才知道原来非常简单. 实际就是在页面中嵌入个控件.社区里已有很多解决方案了.jwplayer是最受欢迎的(之一).控件包括 ...

  3. 用firefox的插件下载网页中的视频

    对于网页中的一些视频,直接下载不了,可以用专用下载软件下载,也可以用firefox的NetVideohunter Video Downloader插件下载网页中的视频,方便快捷. 工具/原料   fi ...

  4. 转:HTML网页中插入视频各种方法

    现在如果要在页面中使用video标签,需要考虑三种情况,支持Ogg Theora或者VP8(如果这玩意儿没出事的话)的(Opera.Mozilla.Chrome),支持H.264的(Safari.IE ...

  5. 【转】HTML网页中插入视频各种方法

    现在如果要在页面中使用video标签,需要考虑三种情况,支持Ogg Theora或者VP8(如果这玩意儿没出事的话)的(Opera.Mozilla.Chrome),支持H.264的(Safari.IE ...

  6. 用flvplayer.swf在网页中播放视频(网页中flash视频播放的实现)

    原:http://blog.csdn.net/ricciozhang/article/details/46868201 由于公司项目的需求,需要在展示一些信息的时候能够播放视频,拿到这个要求,我就从最 ...

  7. 利用CSS的@font-face属性 在网页中嵌入字体

    字体使用是网页设计中不可或缺的一部分.网页是文字的载体,我们希望在网页中使用某一特定字体,但是该字体并非主流操作系统的内置字体,这样用户在浏览页面的时候就有可能看不到真实的设计. 美工设计师最常做的办 ...

  8. IE8下网页中的视频会遮挡住顶层DIV的解决办法

    在IE8浏览器下,发现网页中的视频会遮挡住本来固定在最顶层的DIV.即便使用z-index也无法解决.但是其他浏览器是正常的. 解决的办法很简单,就是在调用flash视频播放器的时候,加上一个参数“o ...

  9. 网页中嵌入百度地图报错:The request has been blocked,the content must served over Https

    网页中嵌入百度地图 1.进入百度地图开发平台:http://lbsyun.baidu.com/index.php?title=jspopular 2.获取密钥:http://lbsyun.baidu. ...

随机推荐

  1. Nim语言的模块化编程

    前言 Nim支持把一大段程序分成若干个模块 一个模块就是一个源代码文件 每个模块都拥有它自己的名称空间 模块化可以起到封装(信息隐藏)和分步编译的作用 一个模块可以通过import语句获得另一个模块的 ...

  2. C#调试入门篇

    DotNet程序的调试,是DotNet程序员必备的技能之一,开发出稳定的程序.解决程序的疑难杂症都需要很强大的调试能力.DotNet调试有很多方法和技巧.现在本文就介绍一下借助DebugView工具进 ...

  3. 我的第一个Linux C 程序

    说明:上篇博客把gcc安装了,接着我们就尝试一下她的厉害吧. 我用的是vi的超级版本vim.这条指令,也就是用vim打开这个文件,如果文件不存在的话,那么创建这个文件. 关于Linux文件的创建,也可 ...

  4. fir.im Weekly - Swift 3.0 的迁移适配指南

    无论你是移动开发者,还是桌面端开发者,或者正在IoT领域探索的技术人员,那么应该更加关注 iDev 全平台开发者大会,也许是后半年 iOS 开发者最盛大的技术盛宴.既有知名公司带来专业视野,又有从 S ...

  5. 每天一个linux命令(34):du 命令

    Linux du命令也是查看使用空间的,但是与df命令不同的是Linux du命令是对文件和目录磁盘使用的空间的查看,还是和df命令有一些区别的. 1.命令格式: du [选项][文件] 2.命令功能 ...

  6. [ASP.net MVC] 将HTML转成PDF档案,使用iTextSharp套件的XMLWorkerHelper (附上解决显示中文问题)

    原文:[ASP.net MVC] 将HTML转成PDF档案,使用iTextSharp套件的XMLWorkerHelper (附上解决显示中文问题) [ASP.net MVC] 将HTML转成PDF档案 ...

  7. Java EE开发平台随手记2——Mybatis扩展1

    今天来记录一下对Mybatis的扩展,版本是3.3.0,是和Spring集成使用,mybatis-spring集成包的版本是1.2.3,如果使用maven,如下配置: <properties&g ...

  8. Form的enctype="multipart/form-data"作用

    <form class="form-horizontal" role="form" method="post" action=&quo ...

  9. 谈谈java的运行机制

    1.高级语言的运行机制 我们编程都是用的高级语言(写汇编和机器语言的大牛们除外),计算机不能直接理解高级语言,只能理解和运行机器语言,所以必须要把高级语言翻译成机器语言,计算机才能运行高级语言所编写的 ...

  10. Cwinux源码解析系列

      Cwinux源码解析系列