flash悬浮在层上的写法及embed深入分析
flash悬浮在Div上的完整写法
<object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="198" height="92" align="middle" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0">
<param name="allowScriptAccess" value="always">
<param name="movie" value="images/flash.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#FFFFFF">
<param name="wmode" value="transparent" />
<embed width="198" height="92" src="images/flash.swf" quality="high" menu="false" name="undefined" allowscriptaccess="always" wmode="transparent" type="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/go/getflashplayer" align="middle"><!– 该条为兼容Chrome –>
</object>
还记得去年第一次技术面试上,面试官问了一个web前端的问题:你发现这个flash是悬浮在页面右边,随着页面上下滚动,但是当浏览器宽度减少时,它会被页面的层遮住,你该如何解决?
因之前对flash了解不多,当时以为是Div的问题,可以通过z-index属性调节上下级关系,可无法解决。面试官还提醒我了,你只要加一句话就能实现,踌躇一会,还是不知道。后面回去找了下答案,那句话就是上面的: <param name="wmode" value="transparent" /> //设置flash为透明
今天碰到的问题是,加一个悬浮的flash效果,ie及ie内核的浏览器都兼容,能够实现效果,但是火狐、谷歌的chrome无法实现,后面找到答案,加上上面最后一句代码即可。
之前对于flash的加载仅是表面的了解、Cope,并没有深入的理解,下面是一些资料的收集、总结,分享给大家:
1、介绍说明Object和Embed标签
要在网页中显示flash内容,必须有指定flash路径的标签,也就是object和embed标签。object标签是用于windows平台的ie浏览器的,而embed是用于windows和macintosh平台下的Netscape Navigator浏览器(90年代IE唯一对手的网景公司开发的浏览器)以及macintosh平台下的IE浏览器。windows平台的IE是利用activex控件(可理解为一种浏览器插件)来播放flash,而其它的浏览器则使用Netscape插件技术来播放flash。 (这里就解释了为什么除了IE浏览器可以播放flash而其它浏览器不支持播放的原因)
2、为什么以上的标签要全部使用?可省略一些标签不?
简单分析说明下,Object标签是用于windows ie3.0及以后浏览器或者其它支持activex控件的浏览器。"classid"和"codebase"属性必须要按上例所示写,主要实现告诉浏览器自动下载flash player的地址,当浏览器没有安装这种flash控件,会进行提示安装,若你不想让客户安装,则可省掉。
Embed标签是用于Netscape Navigator2.0及以后的浏览器或其他支持netscape插件的浏览器。其中"pluginspage"属性同样告诉浏览器下载flash player的地址,同上。
而为了确保大多数浏览器能正常显示flash,你想要把embed标签嵌套在object标签内,如上所示,支持Actives控件的浏览器将会忽略object标签内的embed标签。而其它的使用netscape控件的浏览器则只读取embed标签而不会识别object标签,这里再次解释了上面的结果(有点是存在的:当你只有embed而没有object,IE也能正常显示flash)。
3、接下来是总结列出发布flash中object和embed标签的大部分属性:
一、必需属性
classid -设置浏览器的Activex控件,仅用于object标签。
codebase -设置控件下载地址
width -宽度(百分比或像素)
height -高度(百分比或像素)
src -影片下载地址,仅用于embed标签
pluginspage -设置flash插件的位置,若浏览器没有安装,可以自动下载安装,仅用于embed标签。
movie -指定影片接入或下载地址,仅用于object标签。
二、可选属性及可用的值
- ID-设定变量名,用于脚本代码的引用。仅用于OBJECT。
- NAME -设定变量名,用于脚本代码(如javascript)的引用。仅用于EMBED。
- SWLIVECONNECT - (true或false)指定当flash player第一次下载时,是否启用java。如果些属性省略,默认值为false。你果你在相同页同使用javascript和flash,java必须使用FSCommand来工作。
- PLAY -(true或false)指定flash影片是否在下载完成后就自动播放,如果省略此属性,则默认为true。
- LOOP - (true或false)指定影片播放完最后一帧后是停止还是继续循环播放,如果省略此属性,则默认为true。
- MENU - (true或false) True 显示全部的菜单,允许用户放大,缩小等控制影片播放等操作。False 显示只包含设置选项和关于flash的菜单。
- QUALITY - (low, high, autolow, autohigh, best ) Low 速度优于美观,而且不应用反锯齿。 Autolow 刚开始着重于速度,但当需要时随时提升美观。 Autohigh 同时着重播放速度和美观,但需要时则牺牲美观来保证播放速度。 Medium 应用一些反锯齿而不平滑位图。它质量高于low设置而低于high设置。 High 美观优于播放速度,而且一直应用反锯齿。如果影片不包含动画,位图会被平滑化;而如果影片包含动画,位图将不变平滑。 Best 提供最好的显示质量而不考虑播放速度。所有输出都应用反锯齿及所有位图都被平滑化。
- SCALE - (showall, noborder, exactfit) 。Default(Show all)影片在指定的区域内显示,但保持原始的比例。影片两侧将会出现边框。 No Boder 收缩影片以适合指定的区域,保持影片不失真,但部分影片将可能将裁切。然而保持影片的原始比例。 Exact Fit 使整个影片在指
本博文章基本上属于原创或收集整理,都是心血结晶。
欢迎转载分享,转载请注明出处,谢谢!
本文地址:flash悬浮在层上的写法及embed深入分析