萬盛學電腦網

您现在的位置: 萬盛學電腦網 >> 軟體知識 >  >> 影像處理 >> Flash 教學

Flash 嵌入網頁符合 W3C 標準的變通方案:JS 動態寫入 Object/Embed 標籤

背景問題

XHTML 1.0 Strict / HTML5 標準下,``、`` 標籤屬性(`classid`、`codebase` 等)常導致驗證失敗。雖有 SWFObject 等成熟庫,但輕量專案可採用「JS 動態寫入」繞過驗證器檢查(注意:此為形式合規,實際 DOM 仍包含非標準標籤,語義與無障礙問題未解)。

實作步驟

1. 建立 `flash.js`

function swf(file, w, h) {
    document.write('<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" ' +
        'codebase="https://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" ' +
        'width="' + w + '" height="' + h + '">');
    document.write('<param name="movie" value="' + file + '">');
    document.write('<param name="quality" value="high">');
    document.write('<param name="wmode" value="transparent">');
    document.write('<param name="menu" value="false">');
    document.write('<embed src="' + file + '" quality="high" ' +
        'pluginspage="https://www.macromedia.com/go/getflashplayer" ' +
        'type="application/x-shockwave-flash" width="' + w + '" height="' + h + '"></embed>');
    document.write('</object>');
}

2. XHTML 頁面調用

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>符合web標準的嵌入Flash的方法</title>
    <script type="text/javascript" src="flash.js"></script>
    <style type="text/css">
        #flash { width:500px; margin:50px auto; border:5px solid #03c; }
    </style>
</head>
<body>
    <div id="flash">
        <script type="text/javascript">swf('designyesky.swf','500','220');</script>
    </div>
</body>
</html>

關鍵點與限制