• ベストアンサー

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は外部ファイルで作りたいです。 上記のサイト以外に参考サイトなどありましたら、とてもありがたいです! よろしくお願いいたします!!

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

  • ベストアンサー
  • abril
  • ベストアンサー率69% (388/560)
回答No.3

既にANo.1、2様が適切なご回答をされていますので、これは補足です。 参考にされたサイトのスクリプトは、DOCTYPE宣言がないHTML上で動作している（＝適切なDOCTYPE宣言をしたHTMLファイル上では挙動が変わる可能性がある）ので、そういったサンプルはあまり参考にされない方が宜しいかと…DOCTYPE宣言のないHTML文書はNGですので。 ※以前、似たようなご質問がありましたのでよろしければ参考までに（http://oshiete1.goo.ne.jp/qa4164226.html　※ANo.5-7のみ関連）。

その他の回答 (2)

  • hiromi-5
  • ベストアンサー率15% (36/235)
回答No.2

これくらいなら外部JavaScriptをわざわざ使用しなくてもHTMLとCSSでできるね http://www.stylish-style.com/csstec/ultimate/css-roll-1.html よろしくお願いします

  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.1

メニューについてはjavascriptの板ですでに何度か質問・回答があるので そちらを参考になさってはいかがですか？ http://oshiete1.goo.ne.jp/goo_oshiete.php3?c=254

  1. カテゴリ
  2. [技術者向] コンピューター
  3. その他([技術者向] コンピューター)

関連するQ&A

  • 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）はどのような表示が良いでしょうか？

  • 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側に問題があるのでしょうか？ ソースを見なくても何か考えられることがあれば、教えてください。 よろしくお願いします。

  • 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

  • phpでreadfile(include)した結果に？が出力される

    phpで以下のようなA,Bの2つのファイル構成にした際に ブラウザでAをアクセスし、ソースを表示するとreadfileした結果の前に「?」が出力されます。 「？」と出力されるのが何か問題だと思うのですが、分かりません。 ご指南をお願いいたします。 ?<!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"> Aファイル <?php readfile('inc/xhtml.inc'); include('inc/dbcon.php'); include('inc/cm468_2.inc'); ?> ----------- Bファイル <!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"> -------------------------------- 出力結果 ?<!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">

    • ベストアンサー
    • PHP
  • 音量スライダーの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を諦めて、他のものを探したほうがいいでしょうか？ どなたか、お力をお貸しください！ よろしくお願いします。

  • 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文書を混在させることは可能なのでしょうか？ 皆様のお知恵を拝借させてください。 宜しくお願い致します。

  • ドロップダウンメニューの制作で

    こんにちわ。 http://javascript.eweb-design.com/0701_pdm.html のサイトを参考に ほとんどソースを変えずドロップダウンメニューを制作しようとしていますが HTMLの定義を <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> にすると、上記のサイトのソースだとできないのです。 この定義にてどうしても制作したいのですが、どこを変えればいいのでしょうか？ 参考にし、以下のようにソースを書きました。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <HEAD> <TITLE></TITLE> <SCRIPT language="JavaScript"> <!-- // プルダウンメニュー flag = false; function pullDown01() { if(flag) ID01.style.display = "none"; else ID01.style.display = "block"; flag = !flag; } //--> </SCRIPT> <link href="css/test.css" rel="stylesheet" type="text/css"> </HEAD> <BODY bgcolor="#ffffff"> <TABLE border="0" cellspacing="0" cellpadding="0"> <TBODY> <TR> <TD> <DIV style="background-color:#ffcccc; width:160px"> <div class="test"><p><a href="javaScript:pullDown01()">テスト</a></p></div> </DIV> <DIV id="ID01" style="display:none;"><div class="test2"><p><a href="#">テスト</a></p></div></div> </TD> </TR> </TBODY> </TABLE> <BR><BR><BR><BR> <BR><BR> </BODY> </HTML>

  • JavascriptでObjectからJSON形式変換するにはどうすればいいでしょうか？

    toSourceだと少し違うし、どうすればいいのでしょうか。簡単に変換できる関数でもあればいいのですが、わかりませんでした。 どなたかご教授お願いします。 <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>objctからJSONに変換</title> <script type="text/javascript"> obj = new Object(); obj.test = "txt"; str = obj.toSource(); document.write(str); //--> </script> </head> <body> </body> </html>

  • 画像をループさせて表示させたい。

    すみません、jquery初心者です。 下記サイトのようにコンテンツをループで表示させたいのですが、 http://yurubu.org/jquery-autoload/513 HTMLの <!DOCTYPE html> <html lang="ja"> を <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitio … <html xmlns="http://www.w3.org/1999/xhtml"> に変更すると動きません。。 どう変更すれば動くのでしょうか？ ご教授頂けると大変助かります。 よろしくお願いします。

  • Dreamweaverのデフォルトを変更したい

    Dreamweaverでhtmlドキュメントを新規に作成、かつ、XHTML準拠させると、 <!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"> という宣言も自動で作成されますが、このデフォルト宣言をStrictにしたいのですが、どこでどのような操作をしたらよいのでしょうか？ ご存知の方、お願いします。

    • ベストアンサー
    • HTML

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

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

質問する