- ベストアンサー
xhtml1.0でのJavascriptの動作
こちらのフローティングメニューをWEBサイトに導入します。 http://dynamicdrive.com/dynamicindex1/staticmenu.htm 導入するサイトのDOCTYPEは <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> である必要があります。(【1】とします) フローティングメニューを導入しましたが動作しませんでした。 対策としてDOCTYPEを以下にした場合、問題なく動作しました。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> (【2】とします) このフローティングメニューが 【1】:動作しない 【2】:動作する という両者の違いは、htmlとxhtmlの違いのほかに、 なにかあるのでしょうか。 また、【1】でも動作させるためにはどうしたらよいのでしょうか? ※【2】を試した理由は、 下記のサイトで似たようなものが導入されており、宣言がそのような記述になっていたからです。 http://www.nhncorp.jp/intro/company_info.html
- みんなの回答 (4)
- 専門家の回答
質問者が選んだベストアンサー
一部のブラウザは<!DOCTYPE>の有無による互換モード、標準モードの違いの他に、 XHTML(XML宣言やContent-Typeヘッダによる違いのみの場合もある)、HTMLの違いによるHTMLモードとXMLモードというのがあります。 そのブラウザのXMLモードでは、document.write()が使えませんので、 XHTMLで記述すると動かなくなるスクリプトがあります。 参考ページのサンプルプログラムに > if (!document.layers) > document.write('<div id="divStayTopLeft" style="position:absolute">') こういう部分がありますので、スクリプトエラーとなって動かない可能性もありますから、 <!DOCTYPE>を書かないか、【2】だけのDOCTYPEを書いた互換モードで使用される方がいいと思います。 > また、【1】でも動作させるためにはどうしたらよいのでしょうか? スクリプトを改造するか、 【1】で動くスクリプトに乗り換えるしかないと思います。
その他の回答 (3)
- yyr446
- ベストアンサー率65% (870/1330)
ついでに、XHTMLで動くフォローティングメニューのSCRIPTを紹介しておきます。jQueryのプラグイン「floating div」です。 http://plugins.jquery.com/project/floatobject
お礼
ありがとうございます。 紹介してくださったscriptをはじめ、 他のものも探してみようと思います。
- yyr446
- ベストアンサー率65% (870/1330)
[補足] ご提示のフローティングメニューjavascriptの提供ページをよく見ると FF1、IE5、Opr7でないと動作保障しないとされていますね。 よって、XHTML1.0 標準モードで動作しないのですよ。 【2】にすると互換モード(IE5のモード)になるので動くのです。 【1】で使うには、別のフローティングメニューを使うか、ソースを書き換えるかですね。(おそらく座標関係のピクセルの単位を指定して無いからだめなのでは..適当に言ってます) フローティングについては、jQueryのプラグイン等でありそうです。
お礼
回答および補足ありがとうございます。 レンダリングモードについて理解できました。 動作保証について >FF1、IE5、Opr7でないと動作保障しないとされていますね。 とのことですが、 FF1+ IE5+ Opr7+という表記はそれぞれ Firefox 1.0以上 IE 5 以上 Opera7以上 だと思うのですが・・・
- yyr446
- ベストアンサー率65% (870/1330)
【1】【2】で異なるのは、DOCタイプ宣言によって、ブラウザーのレンダリング モード(解釈の仕方)が代わるからです。つまりブラウザー毎に後方互換モードとか標準モードとかがあり、DOCタイプ宣言内容や参照URLの有無や、先頭に<?xml>が有るかどうかで変わります。 また、ブラウザーの種類やバージョンによってたとえ同じ宣言でもモードが異なります。 ここに詳しくまとめられてます。 http://hxxk.jp/2008/09/29/0118#sub-20080929-06 http://www.animegif.net/tips/html/doctype-html-public.html
お礼
なるほど・・・。 回答ありがとうございます。