首页 > Web前端技术 > js实现视频播放器
201304月6

js实现视频播放器

写作背景

今天做一个项目,里面需要实现一个视频播放器的功能,记得上次使用过一个插件swfobject可以做视频播放器,随后研究了下,之前用的是swfobjectV2.2版本的,但是最后有一个需求,需要实现页面加载完之后进行播放的效果,结果V2.2当时有问题,参数设置完之后不管用,随用就改用了swfobjectV1.5实现功能,随将代码进行分享下。

实现代码

<div id="player" ></div>
<script type="text/javascript" src="${BaseURL}front/js/swfobject.js"/>
<script>
	var s1 = new SWFObject("${BaseURL}front/video/flvplayer.swf",
                              "single","458","305","7");
	s1.addParam("allowfullscreen","true");
	s1.addParam("wmode","transparent");
	//s1.addParam("wmode","Opaque");
	s1.addVariable("file","${BaseURL}front/video/demo.flv");
	s1.addVariable("image","preview.jpg");
	s1.addVariable("autostart","true");
	s1.write("player");
</script>

播放器效果图

解决顶部div被底部flash遮挡

只需要在flash标签中加入以下两个参数即可

<param name="wmode" value="Opaque">
<param name="wmode" value="transparent"> 

如需获取源码或者播放器模板文件 flvplayer.swf,请进行留言

文章作者: iitshare
本文地址:http://www.iitshare.com/js-to-achieve-video-player.html
版权所有 © 转载时必须以链接形式注明作者和原始出处!

更多
本文目前尚无任何评论.

发表评论