首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

网页中嵌入swf资料的几种方法

2013-03-01 
网页中嵌入swf文件的几种方法1. object + embed传统的方法优点:浏览器兼容性好,是 Macromedia 一直以来的

网页中嵌入swf文件的几种方法
1. object + embed       传统的方法
优点:浏览器兼容性好,是 Macromedia 一直以来的官方方法
缺点:
a.embed 标签是不符合 W3C 的规范的,无法通过验证。当然,如果你不在乎什么规范不规范,另当别论。
b.微软由于种种原因,在 sp2 后限制了 IE 的 ActiveX 的使用模式,就是在页面中的 ActiveX 有一个虚框,需要用户点击一次才能正常交互。Flash是作为一个 ActiveX 嵌入到网页中的,所以它也会受牵连,只有通过 JS 嵌入 Flash 才能解决这个问题。
c.没有 Flash 版本检测,如果版本浏览器的flash插件版本不够,或者不能正常显示你的 swf 文件,或者会弹出一个 ActiveX 的确认安装的框。

<object id="forfun" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="400" height="300"    codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0">    <param name="movie" value="/seufld/seufld/flash/focus2.swf">    <param name="quality" value="high">    <param name="bgcolor" value="#F0F0F0">    <param name="menu" value="false">    <param name="wmode" value="opaque"><!--Window|Opaque|Transparent-->    <param name="FlashVars" value="">    <param name="allowScriptAccess" value="sameDomain">    <embed id="forfunex" src="/seufld/seufld/flash/focus2.swf"        width="400"        height="300"        align="middle"        quality="high"        bgcolor="#f0fff8"        menu="false"<!--添加后,ff下才正常-->        play="true"        loop="false"        FlashVars=""        allowScriptAccess="sameDomain"        type="application/x-shockwave-flash"        pluginspage="http://www.adobe.com/go/getflashplayer">    </embed></object>


2. 单object
这种方法的名字叫做 Flash satay,最早是2002年由 Drew McLellan 发表在 A List Apart 上,后来又经过了几次完善:
<object type="application/x-shockwave-flash" data="c.swf?path=movie.swf"width="400" height="300"><param name="movie" value="c.swf?path=movie.swf" /><img src="http://xuguangzhi2003.blog.163.com/blog/noflash.gif" width="200" height="100" alt="网页中嵌入swf资料的几种方法" /></object>

优点:这方法没有embed,可以通过验证,浏览器兼容性也不错
缺点:
a.需要一个 holder swf 来加载你的目标 swf 以保证 IE 中的 stream 能力,如果你需要通过 flashvars 来传参,或者和页面的 JS 交互,会很麻烦。
b.ActiveX的虚框问题。
c.没有版本检测。
d.还是有少数用户代理(比如一些版本的 safari 和一些屏幕阅读器)不认这种方式,有 bug。

3. 双object
<object id="exercises" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="214" height="144">    <param name="movie" value="${contextPath}/flex/photo.swf" />    <param name="wmode" value="window" />    <param name="flashvars" value=""/>    <!--[if !IE]><!-->    <object id="exercisesEx" type="application/x-shockwave-flash"        data="${contextPath}/flex/photo.swf" width="214" height="144">        <param name="flashvars" value=""/>    <!--<![endif]-->        <!--[if gte IE 6]>        <![endif]-->        <!--[if !IE]><!-->        <!--<![endif]-->        <a href="http://www.adobe.com/go/getflashplayer">            <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="网页中嵌入swf资料的几种方法" />        </a>    <!--[if !IE]><!-->    </object>    <!--<![endif]--></object>


4. flex提供的标准方法
<!-- BEGIN Browser History required section --><link rel="stylesheet" type="text/css" href="http://xuguangzhi2003.blog.163.com/blog/history/history.css" /><!-- END Browser History required section --><script src="http://xuguangzhi2003.blog.163.com/blog/AC_OETags.js" language="javascript"></script><!-- BEGIN Browser History required section --><script src="http://xuguangzhi2003.blog.163.com/blog/history/history.js" language="javascript"></script><!-- END Browser History required section --><style>body { margin: 0px; overflow:hidden }</style><script language="JavaScript" type="text/javascript"><!--// -----------------------------------------// Globals// Major version of Flash requiredvar requiredMajorVersion = 9;// Minor version of Flash requiredvar requiredMinorVersion = 0;// Minor version of Flash requiredvar requiredRevision = 60;// -----------------------------------------// --></script></head><body scroll="no"><script language="JavaScript" type="text/javascript"><!--// Version check for the Flash Player that has the ability to start Player Product Install (6.0r65)var hasProductInstall = DetectFlashVer(6, 0, 65);// Version check based upon the values defined in globalsvar hasRequestedVersion = DetectFlashVer(requiredMajorVersion, requiredMinorVersion, requiredRevision);if ( hasProductInstall && !hasRequestedVersion ) {    // DO NOT MODIFY THE FOLLOWING FOUR LINES// Location visited after installation is complete if installation is requiredvar MMPlayerType = (isIE == true) ? "ActiveX" : "PlugIn";    var MMredirectURL = window.location;    document.title = document.title.slice(0, 47) + " - Flash Player Installation";    var MMdoctitle = document.title;    AC_FL_RunContent(        "src", "playerProductInstall",        "FlashVars", "MMredirectURL="+MMredirectURL+'&MMplayerType='+MMPlayerType+'&MMdoctitle='+MMdoctitle+"",        "width", "100%",        "height", "100%",        "align", "middle",        "id", "ManagePlatform",        "quality", "high",        "bgcolor", "#869ca7",        "name", "ManagePlatform",        "allowScriptAccess","sameDomain",        "type", "application/x-shockwave-flash",        "pluginspage", "http://www.adobe.com/go/getflashplayer"    );} else if (hasRequestedVersion) {    // if we've detected an acceptable version// embed the Flash Content SWF when all tests are passed    AC_FL_RunContent(            "src", "ManagePlatform",            "width", "100%",            "height", "100%",            "align", "middle",            "id", "ManagePlatform",            "quality", "high",            "bgcolor", "#869ca7",            "name", "ManagePlatform",            "allowScriptAccess","sameDomain",            "type", "application/x-shockwave-flash",            "pluginspage", "http://www.adobe.com/go/getflashplayer"    );} else { // flash is too old or we can't detect the pluginvar alternateContent = 'Alternate HTML content should be placed here. '    + 'This content requires the Adobe Flash Player. '       + '<a href=http://www.adobe.com/go/getflash/>Get Flash</a>';    document.write(alternateContent); // insert non-flash content}// --></script><noscript>    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"            id="ManagePlatform" width="100%" height="100%"            codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab">            <param name="movie" value="ManagePlatform.swf" />            <param name="quality" value="high" />            <param name="bgcolor" value="#869ca7" />            <param name="allowScriptAccess" value="sameDomain" />            <embed src="http://xuguangzhi2003.blog.163.com/blog/ManagePlatform.swf" quality="high" bgcolor="#869ca7"                width="100%" height="100%" name="ManagePlatform" align="middle"                play="true"                loop="false"                quality="high"                allowScriptAccess="sameDomain"                type="application/x-shockwave-flash"                pluginspage="http://www.adobe.com/go/getflashplayer">            </embed>    </object></noscript>


5. swfobject
http://code.google.com/p/swfobject/
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">    <head>        <title>SWFObject 2 dynamic publishing example page</title>        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />        <script type="text/javascript" src="swfobject.js"></script>        <script type="text/javascript">        swfobject.embedSWF("test.swf", "myContent", "300", "120", "9.0.0", "expressInstall.swf");        </script>    </head>    <body>        <div id="myContent">            <h1>Alternative content</h1>            <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif"             alt="网页中嵌入swf资料的几种方法" /></a></p>        </div>    </body></html>


6. 单embed显示 ie7和ff3下都能正常显示
<embed allowscriptaccess="never" allownetworking="internal" invokeurls="false" src="http://chabudai.sakura.ne.jp/blogparts/honehoneclock/honehone_clock_tr.swf" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" quality="high" autostart="0" wmode="transparent" width="100%" height="300" align="middle">

热点排行