• ベストアンサー

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"> である必要があります。（【１】とします） フローティングメニューを導入しましたが動作しませんでした。 対策としてDOCTYPEを以下にした場合、問題なく動作しました。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> （【２】とします） このフローティングメニューが 【１】：動作しない 【２】：動作する という両者の違いは、htmlとxhtmlの違いのほかに、 なにかあるのでしょうか。 また、【１】でも動作させるためにはどうしたらよいのでしょうか？ ※【２】を試した理由は、 下記のサイトで似たようなものが導入されており、宣言がそのような記述になっていたからです。 http://www.nhncorp.jp/intro/company_info.html

質問者が選んだベストアンサー

  • ベストアンサー
回答No.3

一部のブラウザは<!DOCTYPE>の有無による互換モード、標準モードの違いの他に、 XHTML（XML宣言やContent-Typeヘッダによる違いのみの場合もある）、HTMLの違いによるHTMLモードとXMLモードというのがあります。 そのブラウザのXMLモードでは、document.write()が使えませんので、 XHTMLで記述すると動かなくなるスクリプトがあります。 参考ページのサンプルプログラムに > if (!document.layers) > document.write('<div id="divStayTopLeft" style="position:absolute">') こういう部分がありますので、スクリプトエラーとなって動かない可能性もありますから、 <!DOCTYPE>を書かないか、【２】だけのDOCTYPEを書いた互換モードで使用される方がいいと思います。 > また、【１】でも動作させるためにはどうしたらよいのでしょうか？ スクリプトを改造するか、 【１】で動くスクリプトに乗り換えるしかないと思います。

sasadango3
質問者

お礼

なるほど・・・。 回答ありがとうございます。

その他の回答 (3)

  • yyr446
  • ベストアンサー率65% (870/1330)
回答No.4

ついでに、XHTMLで動くフォローティングメニューのSCRIPTを紹介しておきます。jQueryのプラグイン「floating div」です。 http://plugins.jquery.com/project/floatobject

sasadango3
質問者

お礼

ありがとうございます。 紹介してくださったscriptをはじめ、 他のものも探してみようと思います。

  • yyr446
  • ベストアンサー率65% (870/1330)
回答No.2

[補足] ご提示のフローティングメニューjavascriptの提供ページをよく見ると FF1、IE5、Opr7でないと動作保障しないとされていますね。 よって、XHTML1.0　標準モードで動作しないのですよ。 【２】にすると互換モード（IE5のモード）になるので動くのです。 【1】で使うには、別のフローティングメニューを使うか、ソースを書き換えるかですね。（おそらく座標関係のピクセルの単位を指定して無いからだめなのでは..適当に言ってます） フローティングについては、jQueryのプラグイン等でありそうです。

sasadango3
質問者

お礼

回答および補足ありがとうございます。 レンダリングモードについて理解できました。 動作保証について >FF1、IE5、Opr7でないと動作保障しないとされていますね。 とのことですが、 FF1+ IE5+ Opr7+という表記はそれぞれ Firefox 1.0以上 IE 5 以上 Opera7以上 だと思うのですが・・・

  • yyr446
  • ベストアンサー率65% (870/1330)
回答No.1

【１】【２】で異なるのは、DOCタイプ宣言によって、ブラウザーのレンダリング モード（解釈の仕方）が代わるからです。つまりブラウザー毎に後方互換モードとか標準モードとかがあり、DOCタイプ宣言内容や参照URLの有無や、先頭に＜?xml＞が有るかどうかで変わります。 また、ブラウザーの種類やバージョンによってたとえ同じ宣言でもモードが異なります。 ここに詳しくまとめられてます。 http://hxxk.jp/2008/09/29/0118#sub-20080929-06 http://www.animegif.net/tips/html/doctype-html-public.html

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • XHTML 1.0 Transitional　でインラインフレームの表示方法

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> でインラインフレームを表示する方法はありますか？ 普段は <DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">のドキュメントタイプでサイトを作っているのですが、他の人に作ってもらったサイトが上記のタイプで作られていました。そのサイトにiframeを組み込みたいのですが、表示がされませんでした。そこで、HTML 4.01 のタイプに変更したところ、文字の大きさや高さなどが崩れてしまいます。何かよい方法がありましたら教えてください。宜しくお願いします。

    • ベストアンサー
    • HTML
  • HTMLソースにXHTMLの混在は可能ですか？

    はじめまして。 早速ですが、 現状、サイトＡとサイトＢがあり、 サイトＡは <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> で定義されたHTML文書で書かれており、 サイトＢは <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> で定義されたXHTML文書で書かれています。 そして、サイトＢのフッターにあるグローバルメニューをサイトＡの方にも挿入・反映したいと考えています。 このような場合、HTML文書の中にXHTML文書を混在させることは可能なのでしょうか？ 皆様のお知恵を拝借させてください。 宜しくお願い致します。

  • DreamweaverのXHTMLとIEの関係

    現在作成しているサイト(ホームページビルダーで作ったもの)をDreamweaverでHTMLからXHTMLに変換しようと思い変換してみると 私のサイトはインラインフレームに情報を表示しているのですが、 文字がはみ出していないのにもかかわらず横スクロールバーがでてしまいます。 原因を突き止めようと色々していると、変換時に出てくる <!DOCTYPE html PUBLIC "-//W3C//DTD Xhtml 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> があると横スクロースバーがでることはわかりました。 しかし、これを消してしまうとDreamweaverがXHTMLとして認識してくれません。 <!DOCTYPE html PUBLIC "-//W3C//DTD Xhtml 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> を消さずに横スクロールバーを消す方法は無いでしょうか？ ちなみにFireFoxでは横スクロースバーはでません。 IEのみでます。

  • hp作成　Firefox javascript dreamweaver

    dreamweaverでＨＰを作成する時に <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> が入力されています。 この<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">が入力されているとFirefoxでjavascriptを表示できません。 Firefoxでjavascript表示したい時（DTD）はどのような表示が良いでしょうか？

  • XHTML宣言についてですが自分のものでどこがおかしいのか解りません。

    XHTML宣言についてですが、 私はライブドアブログでブログを作っています。 ブログのチェッカーで引っかかりました。 現在の宣言内容です。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> XHTML1.0 では XML宣言をすることが強く求められています。 と指摘されましたがどうしたらいいかわかりません

  • firefox+xhtml+javascript

    お世話になっております。 divをweb上でドラッグできるスクリプトを組みました。 Opera9.6,IE6では動いているのですが、Firefoxでは、ある条件下でしか動きません。 ある条件とは、DOCTYPEの宣言がされていないことで、XHTMLにしようとDOCTYPEを宣言すると、動作しなくなってしまいます。 <?xml version='1.0' encoding='UTF-8'?> <!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.1//EN' 'http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd'> <html xmlns='http://www.w3.org/1999/xhtml' xml:lang='ja'> <head> <meta http-equiv='Content-Type' content='text/html; charset=UTF-8' /> <meta http-equiv='Content-Script-Type' content='text/javascript' /> <title>test</title> <script type='text/javascript' src='FILENAME.js'></script> -------- <!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.1//EN' 'http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd'> を消せば動きます。 仮に、DOCTYPEをHTML4.1などにしても動きません。 クオートをシングルからダブルにしても同じです。 動かない状態でも、JS自体は読んで、onload関数の中は見に行っているようです（alertを埋め込んだらでたので） 可能性として、 外部ファイルのJSの書き方に問題があるのでしょうか？ それとも、HTML側に問題があるのでしょうか？ ソースを見なくても何か考えられることがあれば、教えてください。 よろしくお願いします。

  • 音量スライダーのJavaScriptが効かない？

    質問させていただきます。 動画を流すサイト作りに携わっています。 私はデザインとコーディングまでが仕事なのですが（動画の実装は他社担当） 音量を調節するスライダーをJavaScriptで付けてくれと 依頼され、あまり詳しくないものでつまづいてます。 下記のように実装してほしいという担当者からの リクエストがあったのでやってみたのですが、IEではスライダーがちゃんと横に動かせるのですが、 FirefoxやMacのsafariなどではダメでした。 http://www.hajimeteno.ne.jp/dhtml/dist/js64.html 調べたところ、上のサンプルと実際にコーディングしているhtmlの文書型宣言が違うことが 原因のようなのです。<!DOCTYPE ～を削除すると意図した通りに動きます…。 上記サンプルでは<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">で、 これならFirefoxでも問題なく動いてます。 コーディング中のhtmlは <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">です。 JavaScriptではそういうことがあるのでしょうか？ このJavaScriptを諦めて、他のものを探したほうがいいでしょうか？ どなたか、お力をお貸しください！ よろしくお願いします。

  • ＤＯＣＴＹＰＥ宣言は厳密に気にするべきか？？

    現在ＷＥＢを独学で学んでおります。 そこでＤＯＣＴＹＰＥ宣言についていくつか疑問に思いました。 ひとつでもわかる方はご回答頂ければ幸いです。 １．<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> と、ソースの頭に記述しておいて <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> の内容で記述(XHTML 1.0 Transitionalで記述)することは可能ですか？？ つまり、HTML 4.01 Transitionalを宣言して終了タグなど、XHTML 1.0 Transitionalの方式で書いても正確に表示されるかを知りたく思って おります。 ２．ＤＯＣＴＹＰＥ宣言を書いてないサイトが多く見受けられますが、 この場合はどのようにＤＯＣＴＹＰＥ宣言と捉えられるのでしょうか？ また、この場合のデメリットとかはありますでしょうか？？ 以上、わかる方いましたらよろしくお願いいたします。

    • ベストアンサー
    • HTML
  • JavaScriptでプルダウン(ドロップダウン)メニューを作りたい！

    JavaScriptでプルダウン(ドロップダウン)メニューを作りたいのですが、 http://www.openspc2.org/reibun/JS_TipsAndTricks/menu/002/index.html このサイトを参考に作ってみたのですが、 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> これを頭に入れるとうまく行きません。 これはどうしても必要なので、どうにかこれ入りで作りたいです。 どうしたら良いでしょうか？ 理想はこんな感じです http://jsajax.com/DropDownMenuArticle286.aspx あと、JavaScriptは外部ファイルで作りたいです。 上記のサイト以外に参考サイトなどありましたら、とてもありがたいです! よろしくお願いいたします!!

  • ＸＨＴＭＬのソースで文字ばけします

    とあるＨＴＭＬの本に書いてあるとうりソースをうっていくと <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtyd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type"content="text/html;charset=utf-8"/> <title>もりのみや<title/> などのＷｅｂ上で文字入力をすると文字化けします。 どうしてでしょうか？ インターネットエクスプローラーを使っています。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する