Flashと代替コンテンツをswfobject.jsで切り替え
：
：2009.08.18
：
：0件
仕事でFlashの代替画像を入れる必要があったので、Flashのパブリッシュ時に書き出されるAC_RunActiveContent.jsで出来るのか試してみましたが…
javaScriptオン、FlashPlayerオフ、もしくは使用できない状態では代替画像を表示する事は無理なようで、他に代わるものは無いかと調べてみたら、swfobject.jsといういいものがありました。しかも設置はとても簡単です。
ダウンロード先：swfobject - Project Hosting on Googole Code
設置方法は２通りあります。
1）オブジェクトタグを使って静的に埋め込む
2）javascriptを使って動的に埋め込む
1）の方法だと、IEでアクティブコントロールの許諾要求がでるようなので、2）の方法で記述してみます。
<head>〜</head>タグ内に以下のコードを記述
-
<script type="text/javascript" src="swfobject.js"></script>
swfもしくは代替コンテンツを表示したい場所に以下のように記述
-
<!-- swfの表示 -->
-
<script type="text/javascript">
-
swfobject.embedSWF(
-
"hoge.swf", //swfファイルへのパス
-
"noFlash",//代替コンテンツを表示するオブジェクトのid
-
"720",//表示されるswfの幅
-
"520",//表示されるswfの高さ
-
"9.0.0"//flashPlayerのバージョン
-
);
-
</script>
-
-
<!-- 代替コンテンツの表示 -->
-
<div id="noFlash">
-
<img src="hoge.jpg" width="720" height="520" alt="代替画像">
-
</div>
swfobject.embedSWFの引数に代替コンテンツを表示するオブジェクトのidを指定するだけで代替コンテンツが表示されるようになっています。とても便利。
代替コンテンツの表示部分にはもちろん画像だけでなく、いろいろと要素も入れられます。
このスクリプトの良い所は、JavaScriptオフ、FlashPlayerオン、またはその逆、またはどちらもオフの場合でも代替コンテンツが表示される事です。
これからかなりお世話になりそうなアイテムです。
このサイトに詳しい事が載っています。
今までSWFが見られない人のために代替コンテンツを埋め込む事など、あまり意識していなかったのでWebデザイナーとして恥ずかしい限りなのだが、現在のユーザの端末は、PCだけでなく、携帯へも広がっていてPCの様にリッチなFlashコンテンツを読込めないものもあり、今後は意識していかなければならないことでしょうね。
コメント/トラックバック
トラックバックURL
この投稿へのコメント/トラックバックはありません。
コメントする