flash的嵌入与读取

嵌入:

 

关于flash嵌入页面这块由于ms的历史原因问题有点乱，根据以下两篇（1 ，2 ）介绍有以下四种方式：

1.Adobe 官方 / OE

 

 

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
        codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
        width="400" height="300" id="movie1">
    <param name="movie" value="http://img01.taobaocdn.com/tps/i1/T12MVIXfVNXXXXXXXX.swf"/>
    <embed src="http://img01.taobaocdn.com/tps/i1/T12MVIXfVNXXXXXXXX.swf" quality="high" width="400" height="300" name="movie"
           type="application/x-shockwave-flash"
           width="400" height="300"
           pluginspage="http://www.macromedia.com/go/getflashplayer"/>
</object>

 

2.SWFObject 静态 / OO

 

 

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
        width="400" height="300" id="movie2">
    <param name="movie" value="http://img01.taobaocdn.com/tps/i1/T12MVIXfVNXXXXXXXX.swf"/>
    <!--[if !IE]>-->
    <object type="application/x-shockwave-flash"
            data="http://img01.taobaocdn.com/tps/i1/T12MVIXfVNXXXXXXXX.swf"
            width="400" height="300">
        <!--<![endif]-->
        <a href="http://www.adobe.com/go/getflashplayer">
            <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif"
                 alt="Get Adobe Flash player"/>
        </a>
        <!--[if !IE]>-->
    </object>
    <!--<![endif]-->
</object>

 

3.代码最少 O

 

 

<object type="application/x-shockwave-flash"
        data="http://img01.taobaocdn.com/tps/i1/T12MVIXfVNXXXXXXXX.swf"
        width="400" height="300"
        id="movie3">
    <param name="movie" value="http://img01.taobaocdn.com/tps/i1/T12MVIXfVNXXXXXXXX.swf"/>
    <a href="go/getflashplayer">
        <img src="get_flash_player.gif" alt="Get Adobe Flash player"/>
    </a>
</object>

 

4.单独使用 embed E

 

 

<embed
        id="movie4"
        src="http://img01.taobaocdn.com/tps/i1/T12MVIXfVNXXXXXXXX.swf"
        quality="high" width="400" height="300" name="movie"
        type="application/x-shockwave-flash"
        pluginspage="http://www.macromedia.com/go/getflashplayer"/>

 

其中单独使用 embed 不可取（太老式？关键是不支持 fallback content ），推荐是object 的方式。

 

读取:

 

 

若允许以上四种方式，要写一个能够读取flash url的通用工具函数，那就要全面考虑了：

1.当前元素是embed ，直接读取 src 即可。

2.当前元素是object ，data是 url，读取 data

3.当前元素是object，还有 name 为 movie 的param，读取该 param 的value。

4.当前元素下有嵌套的object或embed，依次处理。

另一方面 ie 下需要注意的是

1.ie 下取不到 object 内嵌套的 embed 元素。

2.当动态生成的flash尚未插入文档时，这时在ie下若通过 getElementsByTagName来获取所有的param元素，需要使用大写的 "PARAM" 参数.

 

demo @ google code

 

 

flash and accessibility

 

若采用 OE ,E 写入方法则会不能写入替代文本( fallback content )，那么当用户没有安装 flash 时则直接显示空白，造成信息缺失。

 

 

若采用 O ,OO firefox 发生 tab 键陷入现象，tab 到 flash 后会出不来，接连再按 tab 键都没反应，严重损坏了可访问性.

 

 

那么推荐采用 JS 嵌入方法：

 

使用 javascript 脚本输出 flash 标签：

ie : object

其他 embed

JS 判断没有安装 flash 则输出静态图片

禁用 JS 则用 noscript 输图片

 

 

JS 判断 flash 安装与否：

 

/**
     * 获取 Flash 版本号
     * 返回数据 [M, S, R] 若未安装，则返回 undefined
     */
    function getFlashVersion() {
        var ver, SF = 'ShockwaveFlash';

        // for NPAPI see: http://en.wikipedia.org/wiki/NPAPI
        if (navigator.plugins && navigator.mimeTypes.length) {
            ver = (navigator.plugins['Shockwave Flash'] || 0).description;
        }
        // for ActiveX see:	http://en.wikipedia.org/wiki/ActiveX
        else if (window.ActiveXObject) {
            try {
                ver = new ActiveXObject(SF + '.' + SF)['GetVariable']('$version');
            } catch(ex) {
                //S.log('getFlashVersion failed via ActiveXObject');
                // nothing to do, just return undefined
            }
        }

        // 插件没安装或有问题时，ver 为 undefined
        if (!ver) return undefined;

        // 插件安装正常时，ver 为 "Shockwave Flash 10.1 r53" or "WIN 10,1,53,64"
        return arrify(ver);
    }

 

from kissy flash .

 

 

参考资料：

 

object @ w3

OBJECT and EMBED syntax | Flash

Bye Bye Embed

object @w3school

 

Flash Satay: Embedding Flash While Supporting Standards

 

html5 就是大杂烩，妥协了：

embed @ html5

object @ html5

 

 

评论

1 楼 bopeng 2010-08-27