- 締切済み
macromediaのようなメニュー
HTMLとCSSなどを少しかじっている者です。 http://qa.asahi.com/qa1282110.html これを見つけて自分なりにアレンジしようと思ったのですが、色を消したくてもどこを消せばよいかわからず、困っています。 色などはいらないので、メニューをアクティブにしたときに下にサブメニューが出るようなHTML（javascriptを直接head内に書き込んでいただいて）を教えていただけないでしょうか？ そうすれば少しはわかるようになると思うので… ご教授お願いします。。
- goetia
- お礼率52% (20/38)
- JavaScript
- 回答数4
- ありがとう数3
- みんなの回答 （4）
- 専門家の回答
みんなの回答
<html> <head> <style> #menu {position:absolute;height:40px;} #menu ul {margin-left:0; } #menu li {float:left; width:4em; } .sub_menu { display:none;margin-left:1em;background-color:#eee; border:1px #888 solid} .sub_menu a:link { color: #000; background-color:#eee;} .sub_menu a:hover { color: #fff; background-color:#333;} </style> <script> function disp(n){ for(i=1,m=document.getElementById('menu').getElementsByTagName('li').length;i<=m;i++){ document.getElementById('s'+i).style.display=(i==n)?'block':'none'; } } </script> </head> <body> <div id="menu"> <ul style="list-style-type: none"> <li> <a href="sub1.html" onMouseover="disp(1)">menu1</a> <div class="sub_menu" id="s1" onMouseLeave="disp(0)"> <a href="m1sub1.html">abc</a><br> <a href="m1sub2.html">defg</a><br> </div> </li> <li> <a href="sub2.html" onMouseover="disp(2)">menu2</a> <div class="sub_menu" id="s2" onMouseLeave="disp(0)"> <a href="m2sub1.html">hij</a><br> <a href="m2sub2.html">klmn</a><br> <a href="m2sub3.html">defg</a><bri> </div> </li> <li> <a href="sub3.html" onMouseover="disp(3)">menu3</a> <div class="sub_menu" id="s3" onMouseLeave="disp(0)"> <a href="m3sub1.html">opq</a><br> <a href="m3sub2.html">rstufffffvw</a><br> </div> </li> </ul> </div> <br style="clear:both;margin-top:3em"> さっきのはひどかった。これもひどいかもなぁ～<br> </body> </html>
補足
本当に申し訳ないのですが、プルダウンメニューがほしいのではないのです。リンク先の回答だとロールオーバーで色が変わりますよね？その色を抜いたものが、普通のリンク色のものがほしいのです… 補足が足りませんでした。ごめんなさい。
関連するQ&A
- ポップアップメニュー
SuckerTree Vertical Menu (v1.1) http://www.dynamicdrive.com/style/csslibrary/item/suckertree-menu-vertical/%22 のDemoの様なメニューを作りたいのですが、下に出ているCSSとHTMLをコピーしても、DemoのFolder 1から Sub Item 1.1 Sub Item 1.2 には動きませんでした。 JavaScriptか何か足りないタグでもあるんでしょうか？ 詳しい方お願いします？
- 締切済み
- JavaScript
- プルダウンメニューについて
知人から頼まれホームページを作成しています。 javascriptでプルダウンメニューと打ち出し画像の両方を使うとうまく表示されません。 グローバルナビゲーション（プルダウンメニュー）のすぐ下に打ち出し画像がくるレイアウトになります。 打ち出し画像が邪魔をしてプルダウンのサブメニューが表示されません。 【プルダウンメニュー】 http://www.kriesi.at/wp-content/extra_data/suckerfish_tutorial/step4.html 【打ち出し画像】 http://jonraasch.com/blog/a-simple-jquery-slideshow 上記の2つを組み合わせ、プルダウンの伸びたメニューが打ち出し画像に重なり、動かすことは可能でしょうか？ HTMLとCSSの知識はありますが、プログラムの知識はありません。 よろしくお願いします。
- ベストアンサー
- JavaScript
- CSSプルダウンメニューについて
CSSプルダウンメニューについて asahi.comのプルダウンのような縦に表示されなく四角形のようにダウンしてくるプルダウンメニューはどう作成するのでしょうか。いろいろいじってもダメだし、ソースを確認すると文字化けするわで… かといってそのように検索しても全く引っかかりません。 http://www.asahi.com/ http://www.asahicom.jp/css08/top/topstyle.css
- ベストアンサー
- CSS
- jQueryでプルダウンメニュー
jQueryでプルダウンメニューを作ろうと思いまして、 とりあえず、リストにカーソルを合わせるとネストしたリストが表示されるようにしてみましたが、 うまく動きません。どうしてでしょうか？ ソースです↓ <!DOCTYPE HTML> <html> <head> <script type="text/javascript" src="http://www.google.com/jsapi"> </script> <script type="text/javascript"> google.load("jquery", "1"); </script> <script type="text/javascript"> $(function(){ $(ul li).hover( function(){ $(this).children(ul).show();}, function(){ $(this).children(ul).hide();} ); }); </script> </head> <body> <ul> <li>MENU <ul style="display:none;"> <li>sub-MENU1</li> <li>sub-MENU2</li> </ul> </li> </ul> </body> </html>
- ベストアンサー
- JavaScript
- アコーディオンメニュー 開いたまま動かない
アコーディオンメニューを設置したく検索をかけサンプルを入手、手直ししながら設置を試みるのですが、サンプルからして「JavaScriptの記述後 bodyが表示されない」、「親メニューはOKだがサブメニューが開かない」などなど、もう手詰まり状態です。 二日かかって下記 URLまでたどり着き正常な位置にきれいに並ぶのですが、私の作っているページ内ではメニューが開いたままの状態です。 http://d.hatena.ne.jp/takahashijunko/20120202/1328189955 「DOCTYPE宣言」、「@charset "UTF-8」の違いなどで私のページ（以下に記述）で使うことは無理なのでしょうか、それとも私はまったく勘違いをしているのでしょうか？ アコーディオンメニューを使える道があるならばご教授ください。 --------------------------------- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title>○○○○○</title> <meta name="description" content="○,○,○,○,"> <meta name="keywords" content="○,○,○,○,,"> <meta http-equiv="Content-Style-Type" content="text/css"> <link rel="stylesheet" href="style.css" type="text/css"> <link rel="stylesheet" href="style2.css" type="text/css"> <script type="text/javascript" src="js/jquery-1.6.min.js"></script> ・・・・URL先コピペの為省略・・・・ </script> </head> XP Chrom - IE8 - Firefox3.6 にて検証 よろしくお願いします。
- ベストアンサー
- HTML
- Spryでメニューバーを作成について
自分はHP作成初心者です。 早速質問ですが、Spryでメニューバーを作成したとき メインのメニュー項目だけ、テキストの行揃えを中央にして サブメニューを左揃えにしたいです。 あと、メニューの文字がHTMLのではなくて 画像で作りたいのですが、メインのメニュー項目は 出来たのですが、サブメニューが出来ません。 SpryのCSSを編集すると思いますが、 どうしてもわかりません。 お分かりの方がいらっしゃいましたら 教えて下さい。 よろしくおねがいします。 http://www.goincase.com/ ↑のサイトみたいにしたいです。 私はOSがmacでDW CS4を使用しています。
- 締切済み
- HTML
- FlashとJavascriptのメニューについて
現在Javascriptのドロップダウンするサブメニューを作っています。（http://lolipop.jp/のような感じ） そのメニューの下にFlashムービーを配置したいのですが、ドロップダウンしてくるサブメニューはFlashの下に隠れてしまいます。つまり1つ下のレイヤーに表示されてしまいます。 Javascriptをいかしたまま、サブメニューをFlashの上に表示させる方法はありますか？ぜひ教えてください。宜しくお願いします。
- 締切済み
- Flash
- メニューをリンクにするには
HTMLとJavaScriptでホームページを作成しています。 メニューをリンクにしたいのですが、上手くいきません。どこで調べたら分かりますか。 これについて、ご教授ください。お願いします。
- ベストアンサー
- JavaScript
- 飛び出すメニューについて
http://www.ex-yz.com/labo/flash/2007/05/2.html これのような、マウスオーバーで下位項目が出てくるというメニューをFlashで作りたいと考えています。 このサンプルでは飛び出す最大の範囲までFlashの領域として確保されていますが、 通常ヘッダーなどに置いた場合、そんなに下が開いている事はあり得ないと思うので 最初から表示されている部分（メインメニュー）のみを初期のFlashの領域とし、 飛び出たサブメニュー部分は下のhtmlに被らせるような状態で作りたいと思うのですが、 これはどうすれば実現できるのでしょうか？ Flashとhtmlだけではできないのでしょうか。 あと、Flashで作られたこういうロールオーバーでサブが出てくるようなメニューで 何かかっこいいサイトや効果的な使い方をされているような 参考になるサイトがあれば教えてください。 Javascriptでも作れるような、ただ降りてくるだけのものではなく Flashならではというものを色々見てみたいので。 よろしくお願いします。
- ベストアンサー
- Flash
- 文字の上に乗せると、メニューが変わる仕組み
下記のアドレスはWall street Journalのサイトです。 http://jp.wsj.com/ 上のメニューの仕組みについて教えて頂きたいのですが… 例えば、「米国」の上に乗せると、 下のサブメニューが代わり、「経済」「政治」となりますよね。 これを自分のホームページでも作りたいのです。 JavaScriptで作っているのでしょうか？ ソースはどんな感じでしょうか？
- ベストアンサー
- CSS
お礼
なるほど！ありがとうございます。 しかし必ず色指定は必須なのでしょうか。色指定の部分を抜けば、デフォルトのリンク色になる、という考えは甘いでしょうか・・・