タグ: IE

Internet Explorer – PNG が表示されなくなった

IE8 を使っていて、Google トップページなどでPNG画像が表示されなくなってしまった。
原因を探っていて、そういえば QuickTime をアンインストールしたなと思い出し、ここからレジストリ設定ファイルを落としてきて修復したら直りました。

SWFObject – IE で Flash から fscommand が実行できない対策

IE で Flash ムービー(foo.swfなど)を innerHTMLなどで動的に埋め込むと, VBスクリプトでイベントを取れなくなるのが原因のようです。
 
対策は、SWFObject FAQに書かれているように

5.なぜ動的なパブリッシュを行うとインターネットエクスプローラーで fscommand が動かなくなるのか。
Adobe は fscommand をインターネットエクスプローラーで動作させるため、
FSCommand 呼び出しを受け取り JavaScript に転送するための VBScript を追加するように推奨しています。
ですが SWFObject の動的なパブリッシュメソッドで行っているように、
innerHTMLや outerHTML などを使って Flashムービーを挿入する場合には VBScript は全く動作しません。
 
運がいいことに、VBScript の代わりに JavaScript を使っても fscommand の呼び出しを受け取る方法があります。
このちょっと下にあるコードではプロプライエタリ(訳注:専用の？)属性(を、あなたのコードをおかしくさせないために、さらに条件分岐コメントで括ったもの)を使っています。
 
例として、下のVBScriptは、

<SCRIPT LANGUAGE=VBScript>
on error resume next
Sub myCom_FSCommand(ByVal command, ByVal args)
  call myCom_DoFSCommand(command, args)
end sub
</SCRIPT>

次のように置き換えることが可能です。

<!–[if IE]>
<script type=”text/javascript” event=”FSCommand(command,args)” for=”myCom”>
  myCom_DoFSCommand(command, args);
</script>
<![endif]–>

 
注意:Flash 8 以上でパブリッシュしている場合、JavaScript – ActionScript間の通信には fscommand() を利用するよりも ExternalInterface が推奨されています。
 
コードの例は SWFObject のテストスイートでも見つけることができます。

参考:
– FlashとJavaScriptの連携
– SWFObject v2.0 ドキュメント日本語訳
– Why doesn’t fscommand work in Internet Explorer with dynamic publishing ?(SWFObject FAQ)
– ExternalInterface(ActionScript 3.0 コンポーネントリファレンスガイド)

ブラウザの検索バーを好きなサイト向けにカスタマイズする

Firefox 2 以降(Firefox3 含む)とInternet Explorer 7 以降は検索バーのプラグイン仕様が同じ OpenSearch という記述フォーマットの XML を採用しています。
 
自分で XML を書けば好きなサイトを追加できるのですが、いちいち最初から書くのはちょっと面倒、という人のためのオンラインサービスを紹介します。
 
Ready2Search
 
このサイトを利用すると検索キーワードを入れるための GET URL を入力するだけで簡単にプラグインが作成・インストールできます。
 
詳しい使い方はReady2Searchでの検索プラグイン作成を参照してください。
 
参考:
Creating OpenSearch plugins for Firefox

ブラウザを HTML 開発環境にするツール

Firefox (Firefox2, Firefox3)の場合:
– Firebug
HTML/CSS/JavaScript の調査、編集を動的に行えるアドオン。
インストールすると「ツール(T) -> Firebug」メニューが追加されます。
 
– Web Developer 日本語版(本家: Web Developer)
最近は Firebug に水をあけられていますが Firefox 1 の時代からあるアドオン。
HTML/CSS の調査、CSS の編集ができます。
また、CSS, JavaScript や一部HTML要素の無効化、FORM の GET <-> POST 変換など痒いところに手が届く機能があります。一般ユーザ向けには Firebug よりこちらのほうがよさそうです。
 
– Live HTTP Headers
HTTP リクエストヘッダ、レスポンスヘッダの閲覧ができるようになるアドオン。
インストールすると「ツール(T) -> Live HTTP headers」メニューが追加されます。

Internet Explorer (IE6,IE7) の場合:
– Internet Explorer Developer Toolbar(Microsoft 公式)
インストールすると「表示(V) -> エクスプローラバー(E) -> IE Developer Toolbar 」を選択することで HTML/CSS の調査ができるようになります。
編集は Attribute: の項目からの各タグの属性(name=”” や id=””, style=””, onClick=”” など)の変更のみに限られているようです。
ちなみに、IE8 では開発ツールが標準搭載されていて Shift+F12 を押すと起動できるとのことです(参考)。
 
– ieHTTPHeaders
Live HTTP headers の IE 版。HTTP リクエストヘッダ、レスポンスヘッダの閲覧ができます。
インストールすると「表示(V) -> エクスプローラバー(E) -> ieHTTPHeaders 」メニューが追加されます。

参考:
http://labs.unoh.net/2008/08/introduction-of-css-coding-tools.html

IE – innerHTML で OBJECT タグを正しく取得できない

SWFObject.js を使っていて気が付いたのですが,
IE では 以下のような処理で、(element).innerHTML がどうもうさんくさい動作をします。
(検証バージョン: Internet Explorer Version 6.0)

<span id=”exp_object_tag”>
    <object id=”foo” classid=”clsid:D27CDB6E-AE6D-11cf-96B8-444553540000″ width=”100%” height=”100%”>
      <param name=”movie” value=”foo.swf” />
      <param name=”bgcolor” value=”#CCCCFF” />
      <param name=”quality” value=”high” />
      <param name=”scale” value=”noscale” />
      <param name=”flashvars” value=”message=hello” />
    </object>
</span>
<script type=”text/javascript”>
//<![CDATA[
    alert(document.getElementById(“exp_object_tag”).innerHTML);
//]]></script>

このコードを含むHTMLの表示結果は、単純にソースのまま表示されるという一般的な期待に反して次のようになります。

(注:実際は改行はありませんが、見やすさのため改行をいれてあります)
<OBJECT id=sotester height=”100%” width=”100%” classid=clsid:D27CDB6E-AE6D-11cf-96B8-444553540000>
<PARAM NAME=”_cx” VALUE=”5080″>
<PARAM NAME=”_cy” VALUE=”5080″>
<PARAM NAME=”FlashVars” VALUE=””>
<PARAM NAME=”Movie” VALUE=”so_tester.swf”>
<PARAM NAME=”Src” VALUE=”so_tester.swf”>
<PARAM NAME=”WMode” VALUE=”Window”>
<PARAM NAME=”Play” VALUE=”-1″>
<PARAM NAME=”Loop” VALUE=”-1″>
<PARAM NAME=”Quality” VALUE=”High”>
<PARAM NAME=”SAlign” VALUE=””>
<PARAM NAME=”Menu” VALUE=”-1″>
<PARAM NAME=”Base” VALUE=””>
<PARAM NAME=”AllowScriptAccess” VALUE=””>
<PARAM NAME=”Scale” VALUE=”NoScale”>
<PARAM NAME=”DeviceFont” VALUE=”0″>
<PARAM NAME=”EmbedMovie” VALUE=”0″>
<PARAM NAME=”BGColor” VALUE=”FF66FF”>
<PARAM NAME=”SWRemote” VALUE=””>
<PARAM NAME=”MovieData” VALUE=””>
<PARAM NAME=”SeamlessTabbing” VALUE=”1″>
<PARAM NAME=”Profile” VALUE=”0″>
<PARAM NAME=”ProfileAddress” VALUE=””>
<PARAM NAME=”ProfilePort” VALUE=”0″>
<PARAM NAME=”AllowNetworking” VALUE=”all”>
<PARAM NAME=”AllowFullScreen” VALUE=”false”>
</OBJECT>

時動的にパラメータを追加するのはともかく、

<PARAM NAME=”FlashVars” VALUE=””>

とされてしまうのはいただけません。
 
なお、 += オペレータでも同様の現象が発生するため、次のようにすると FlashVars でパラメータが渡せなくなってしまい、不具合の原因になります。

document.getElementById(“exp_option_tag”).innerHTML += “Break it!!”;

 
参考:
– innerHTML Property (MSDN)
– Can’t pass innerHTML to Internet Explorer containing <param ../>(mootools forums)