Quantcast
Channel: cyano » JavaScript
Viewing all articles
Browse latest Browse all 4

2006年4月のActiveXパッチがあたったIEでFlashなどを従来通り表示させるためのJavaScript(Flashのバージョン検出機能付き)

0
0

Eolasの特許回避のため、2006年4月の月例パッチでInternetExplorerのActiveX周りに変更が加えられました。

具体的には、従来のようにHTMLページ内にobjectタグやembedタグでFlashを表示するように記述した場合、Flash上にマウスカーソルを持って行くと「このコントロールをアクティブ化して使用するにはクリックしてください」 と表示され、そのFlashがクリックを受け付けたり、マウスの位置情報を取得したりするためには(インタラクティブに振る舞うには)、一旦Flash上でクリックなどをしてFlashコントロールをアクティブ化しなくてはならなくなりました。

これの回避方法として、外部JavaScriptによって動的にobjectタグやembedタグを書き出す方法があるのですが、Adobeが公開している対策スクリプトがいまいちだったので、自作しました。

ダウンロードはこちら swfTagWriter107.zip。配布ライセンスはMITライセンスです。

使い方は、Flashを表示しているobjectタグが書いてある部分を、以下のよう書き換えるだけです。

<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.writeHTML();
//]]>
</script>
<noscript>
<object data="fma.swf" width="720" height="200" type="application/x-shockwave-flash">
<param name="movie" value="fma.swf" />
</object>
</noscript>

JavaScriptが書き出すタグはXHTML1.0 Validになるようにしています。See also:FlashをXHTMLで表示させるには(embedタグを使わずに表示させるには)

詳しいリファレンスは以下の通り。

関数 jp.catalase.SwfTagWriter
種類 コンストラクタ
説明 FlashTagWriterオブジェクトを作ります
引数
1 swfファイルのパス
2 swfにDOMでアクセスする際のID
3 swfの幅
4 swfの高さ
使用例
<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.writeHTML();
//]]>
</script>

生成されるHTMLは以下のようなものになります。

<object type="application/x-shockwave-flash" data="fma.swf" width="720" height="200" id="test01" >
<param name="movie" value="fma-1.swf" />
<param name="loop" value="false" />
<param name="quality" value="high" />
</object>
関数 setRequiredVersion()
種類 jp.catalase.SwfTagWriterのインスタンスメソッド
説明 指定したswfを表示するために最低限必要なFlash Playerのバージョンを指定します。このバージョン未満のFlash Playerがインストールされていた場合、setAltContent()で指定したコンテンツを代わりに表示します。
引数
1 FlashPlayerのメジャーバージョン
2 FlashPlayerのマイナーバージョン
3 FlashPlayerのリリースバージョン
使用例
<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.setRequiredVersion(7,0,20);
swf.setAltContent('最新のFlashPlayerをインストールしてください');
swf.writeHTML();
//]]>
</script>
関数 setLoop()
種類 jp.catalase.SwfTagWriterのインスタンスメソッド
説明 指定したswfをループ表示するかしないかを設定します。
引数
1 ループ表示する場合true、しない場合false。デフォルトはfalse。
使用例
<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.setLoop(true);
swf.writeHTML();
//]]>
</script>
関数 setQuality()
種類 jp.catalase.SwfTagWriterのインスタンスメソッド
説明 指定したswfの表示品質を設定します。
引数
1 "high", "medium", "low"のいずれか。デフォルトは"high"。
使用例
<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.setQuality("low");
swf.writeHTML();
//]]>
</script>
関数 setAltContent()
種類 jp.catalase.SwfTagWriterのインスタンスメソッド
説明 Flash Playerがインストールされていない場合、もしくはIE以外でインストールされているFlashPlayerのバージョンがsetRequiredVersion()未満だった場合に表示するHTMLを指定します。(IEの場合自動アップデートが働くのでFlash Playerがインストールされていない場合のみ代替HTMLを表示します)。
引数
1 代替のHTML
使用例
<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.setAltContent('<img src="a.gif" width="720" height="200" alt="alternative content" />');
swf.writeHTML();
//]]>
</script>
関数 addFlashVars()
種類 jp.catalase.SwfTagWriterのインスタンスメソッド
説明 Flash Player 6以降で、Flash Playerに変数を渡すFlashVarsに指定する値を設定します
引数
1 FlashVarsのキー
2 FlashVarsの値
使用例
<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.addFlashVars('key1', 'val1');
swf.writeHTML();
//]]>
</script>

生成されるHTMLは以下の通り

<object type="application/x-shockwave-flash" data="fma.swf" width="720" height="200" id="test01" >
<param name="movie" value="fma-1.swf" />
<param name="loop" value="false" />
<param name="quality" value="high" />
<param name="flashvars" value="key1=val1" />
</object>
関数 addAttribute()
種類 jp.catalase.SwfTagWriterのインスタンスメソッド
説明 objectタグに設定する属性を指定します
引数
1 属性名
2 属性の値
使用例
<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.addAttribute('accesskey', 'a');
swf.writeHTML();
//]]>
</script>

生成されるHTMLは以下の通り

<object type="application/x-shockwave-flash" data="fma.swf" width="720" height="200" id="test01" accesskey="a" >
<param name="movie" value="fma-1.swf" />
<param name="loop" value="false" />
<param name="quality" value="high" />
</object>
関数 addParam()
種類 jp.catalase.SwfTagWriterのインスタンスメソッド
説明 objectタグにの中に入れるparamタグを設定します。
引数
1 paramタグのname属性
2 paramタグのvalue属性
使用例
<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.addParam('param1', 'value1');
swf.writeHTML();
//]]>
</script>
関数 doesShowPlayerInstallMsg()
種類 jp.catalase.SwfTagWriterのインスタンスメソッド
説明 Flash Playerがインストールされていない場合に、インストールを促すメッセージを表示するかどうかを指定します。メッセージはsetPlayerInstallMsg()で指定します。
引数
1 表示する場合はtrue、表示しない場合はfalse。デフォルトはfalse。
使用例
<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.doesShowPlayerInstallMsg(false);
swf.writeHTML();
//]]>
</script>
関数 setPlayerInstallMsg()
種類 jp.catalase.SwfTagWriterのインスタンスメソッド
説明 Flash Playerがインストールされていない場合に、表示するHTMLです。
引数
1 HTML
使用例
<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.doesShowPlayerInstallMsg(true);
swf.setPlayerInstallMsg('<p><a href="http://tinyurl.com/knoal">Flash Playerをインストールしてください</a></p>');
swf.writeHTML();
//]]>
</script>
関数 writeHTML()
種類 jp.catalase.SwfTagWriterのインスタンスメソッド
説明 swfを表示するためのHTMLを書き出します。
引数 なし
使用例
<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.writeHTML();
//]]>
</script>
関数 setFlashDetectorSwfUrl()
種類 jp.catalase.SwfTagWriterのインスタンスメソッド
説明 IEにおいて、Flash Player 7未満がインストールされている環境で、リリースバージョンを検出するためのswf(配布ファイル内のFlashDetector.swf)のパスを指定します。 指定しない場合、IEのFlash Player 7未満ではリリースバージョンを検出できません。
引数 なし
使用例
<script type="text/javascript">
//<![CDATA[
var swf = new jp.catalase.SwfTagWriter('fma.swf', 'test01', 720, 200);
swf.setFlashDetectorSwfUrl('FlashDetector.swf');
swf.writeHTML();
//]]>
</script>
関数 jp.catalase.FlashPlayerDetector.isFlashPlayerAvailable()
種類 jp.catalase.FlashPlayerDetectorのクラスメソッド
説明 Flash Playerがインストールされているかどうかを検出します。
引数 なし
使用例
<script type="text/javascript">
//<![CDATA[
alert(jp.catalase.FlashPlayerDetector.isFlashPlayerAvailable());
//インストールされている場合true、されていない場合false
//]]>
</script>
関数 jp.catalase.FlashPlayerDetector.getFlashPlayerVersion()
種類 jp.catalase.FlashPlayerDetectorのクラスメソッド
説明 Flash Playerのバージョンを検出します。
引数 なし
返値 jp.catalase.FlashPlayerDetector.PlayerVersionクラスのインスタンス
使用例
<script type="text/javascript">
//<![CDATA[
var ver = jp.catalase.FlashPlayerDetector.getFlashPlayerVersion();
alert(ver);
//「7,0,20,0」など
//]]>
</script>

更にブラッシュアップしていこうと思っているので、ご意見などはコメント欄まで。

追記 2006/4/26

同様のことをするスクリプトにSWFObjectがあるのですが、以前はFlashObjectと呼ばれていました。ただ、Flashという商標をAdobe法務部が使うことを許さなかったため、SWFObjectに改名したようです。当方も法務部に怒られるのはいやなのでSwfTagWriterに変更しました。

追記 2006/5/1

swfTagWriter106.zipにいくつかバグを見つけたのでswfTagWriter107.zipとしてリリースしました。


Viewing all articles
Browse latest Browse all 4

Latest Images

Trending Articles





Latest Images