如何在网页中插入FLV播放器

如何在网页中插入FLV播放器,第1张

如果你想在网站放上一些 FLV 文件,做成像YouTube、土豆、优酷之类的视频界面,让大家在线观看,在网页中插入FLV播放器的方法是:使用JWPlayer,JWPlayer是一个向导式的软件;你按照它的提示一步一步 *** 作,将FLV文件插入即可生成一个漂亮、个性化的网页播放器。

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="305" height="205">  

    <param name="movie" value="Flvplayer.swf" />  

    <param name="quality" value="high" />  

    <param name="allowFullScreen" value="true" />  

    <param name="FlashVars" value="vcastr_file=movies/11.flv&LogoText=test&BufferTime=3" />  

    <embed src="Flvplayer.swf" allowfullscreen="true" flashvars="vcastr_file=movies/11.flv&LogoText=test" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="505" height="405"></embed>  

</object>

以上代码放在<body></body>中即可。

可以看出这是使用swflash.cab一种ActiveX控件实现的播放效果,其实就是这个:Adobe Shockwave Player 12.0.2.122

vcastr_file=movies/11.flv是你的视频路径。<param name="movie" value="Flvplayer.swf" />  这个value的值表示播放器名称,注意路径的设置。

以上代码,笔者亲自测试,在IE6、IE7、IE8、IE9、IE10、Firefox、Chrome几大浏览器都能正常播放,兼容性近乎完美。

Flv文件也只是视频文件,它的播放同样是需要播放器的,而这个播放器就是FlashPlayer。

第一种方法:

将本地Flv文件导入部署到Flash软件中,以库中元素的形式而存在,将该元素拖入场景,调整位置后,发布为swf文件即可。

注意以上文件在本地测试没有问题,但上传到网络时,其他浏览者是无法查看的,因为当前的播放器调用的是本地Flv文件。

所以,需要调整路径。首先需要将Flv文件上传到某个网络空间,并且获得其准确的路径地址。

其次,打开Flash软件,选择Flv组件,Alt+F7打开“组件检查器”,将“ContentPath”中的路径由本地地址替换为网络绝对地址

再来将该Flash发布导出swf文件。这时候才可以任意使用该swf文件,如同插入其他一般Flash文件一样。

测试: http://www.cnbruce.com/flv/13.swf

当然,此时还会有个播放器控制按钮相关的一个swf文件,记得要附带着。

第二种方式:

在第二种方式介绍之前,你有没有发觉第一种方式有点麻烦?因为我们是需要将视频插入到网页的,现在却需要先制作一个swf播放器文件,其中还有些曲折。然后再打开网页编辑器将swf文件插入。

正如我们在网页中插入Flash按钮一样,先要用Flash制作按钮,然后将该Flash插入到网页。但你有没有注意到Dreamweaver提供了直接插入Flash按钮的功能,也就是说:你不必去制作Flash按钮,直接通过DW中该途径就能很快完成自己的需要。

那么,同样,现在的Dreamweaver8支持了这一功能:插入Flash视频

你不需要去制作播放视频的swf文件,只需要提供一个Flv视频文件即可。这也就是我所要说的重点。

打开插入面板,选择常用类别,单击媒体按钮后的向下箭头,从下拉列表中选择“Flash视频”

d出的对话框中,可使用网络上已经固定的Flv文件地址,还可以是选择浏览本地的Flv文件,但要注意该Flv文件应是你所定义的DW当前该站点中的,以获得相对路径,便于之后所有文件一起上传后,一样能寻找到该文件。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/11463299.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-16
下一篇 2023-05-16

发表评论

登录后才能评论

评论列表(0条)

保存