締切済み

ポップアップメニュー

2007/07/27 17:24

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か何か足りないタグでもあるんでしょうか？詳しい方お願いします？

hisahata
お礼率0% (0/1)

JavaScript
回答数1
ありがとう数1

みんなの回答 （1）
専門家の回答

みんなの回答

susie-t
ベストアンサー率86% (37/43)

2007/07/27 18:18 回答No.1

単純に <html> <head> (CSSとスクリプト) </head> <body> (HTML) </body> </html> とやったらできましたが・・・。 bodyタグとか忘れてませんか？

関連するQ&A

プルダウンメニューについて教えてください。

プルダウンメニューについて教えてください。 http://www.dynamicdrive.com/style/csslibrary/item/suckertree-menu-vertical/ ここに乗っているタグでメニューを作成したのですが、なぜか ●隙間が開いてしまう ●サブメニューがすぐに閉じてしまうという現象が起きて困っています。スクリーンショットを置きます。 CSSの部分をいろいろ変えてみたのですが、解決できませんでした。どなたか教えて下さると助かります！どうかお願いします。
ポップアップのメニューバーの作り方

メニューバーをポップアップで作成したいのですが、ＨＴＭＬとＣＳＳだけで作ること可能でしょうか。可能であれば、ソースや、おすすめの本、サイトなどをご教示お願いいたします。作りたいメニューバーは、親メニューをマウスオーバーするとサブメニューがポップアップで表示されて、サブメニューをクリックするとリンク出来るメニューバーです。ネットで検索したところ、ジェイクエリー　モバイルや、JavaScrip を使用した方法は見つけたのですが、私は初心者で、ＨＴＭＬとＣＳＳしか知識がありません。ＨＴＭＬとＣＳＳだけでは作成が難しい場合、他の方法（ジェイクエリー　モバイルや、JavaScrip 等）で初心者でも出来そうなやり方（おすすめのやり方）があれば、ご教示お願いいたします。
macromediaのようなメニュー

HTMLとCSSなどを少しかじっている者です。 http://qa.asahi.com/qa1282110.html これを見つけて自分なりにアレンジしようと思ったのですが、色を消したくてもどこを消せばよいかわからず、困っています。色などはいらないので、メニューをアクティブにしたときに下にサブメニューが出るようなHTML（javascriptを直接head内に書き込んでいただいて）を教えていただけないでしょうか？そうすれば少しはわかるようになると思うので… ご教授お願いします。。
menuのHTMLタグとCSSが上手くいかない

画像(1)が現状です。イメージは(2)です。何故HTMLタグを別々にするかというとスマホにしたらsubメニューをボトムに配置したいのです。メニューとsubメニューの背景がくっつかないのです。 (1)を(2)にするにはどうすれば良いでしょうか？以下がHTMLタグとCSSになります。アドバイスをお願いします。 HTMLタグ <div class="div1"><ul><li>メニュー1</li><li>メニュー2</li><li>メニュー3</li><li>メニュー4</li></ul></div> <div class="div2"><ul><li>sab1</li><li>sub2</li></ul></div> CSSスタイル ul li { list-style: none; } .div1 { background: #ccc; float: left; } .div2 { width: 240px; background: #999; float: right; } li { float: left; padding: 5px 15px; }
javascriptでポップアップメニュー

はじめまして。題記の件でつまっています。画面上のメニュー表示項目にマウスカーソルを合わせると、その位置にサブメニューを表示させたいです。サブメニュー表示時に実現したいことは以下の3点です。 1.サブメニューのHTMLは画面上に記述しておき、カーソルがメニュー表示項目にある場合のみvisibleにする 2.サブメニューはカーソルが別のメニュー表示項目に移動した場合には、別のメニュー表示項目上でサブメニューを出すようにし、メニュー表示項目以外にカーソルが移動した場合には、メニューを非表示にする 3.サブメニューの表示位置はマウスカーソルの位置にする＜イメージ＞ /* メニュー部分*/ <ul> <li>メニュー表示項目1</li> ※1 <li>メニュー表示項目2</li> … </ul> /*サブメニュー部分*/ <div id="menu" class="hidden"> <div>サブメニュー1</div> <div>サブメニュー2</div> </div> ※1にカーソルをあてると、下のhidden項目をカーソル位置に表示するカーソル移動にあわせてメニューを追従させたり、メニュー領域以外の場合に非表示とすることができません。（つまりほとんどうまくいってないのですが・・・）どうかご教示いただけないでしょうか。よろしくお願いします。ちなみに以下のサイト様を参考にさせていただいてますが、こちらはカーソル位置に表示ではなく固定位置にサブメニュー表示でした。 http://miyakekobo.fc2web.com/temp/total_pd104.html
ポップアップメニューの作成方法

例えばMicrosoftのトップページの http://www.microsoft.com/japan/ のように、ポップアップメニューを画像ではなく HTML(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の知識はありますが、プログラムの知識はありません。よろしくお願いします。
HTMLのメニューをインクルードできますか？

PHPでいう <? include("menu.htm"); ?> と同じ事をJavascriptで実現してメニュー用のHTMLを各HTMLに埋め込みたいのですが可能でしょうか？ document.write("メニューのHTMLタグ")では改行が入るとNGみたいで。。
ポップアップメニューの制御について

こんにちは。現在、ポップアップメニューの制御がうまくいかず困っております。 [やりたいこと] ・リンクの上にマウスを置くとポップアップメニューが開く・ポップアップメニューからマウスが外れるとポップアップメニューを閉じる・対応したいブラウザはIE6,IE7,FireFox2.0 他のサイトを参考にした結果、onmouseoverのイベントでメニュー表示まではできたのですが、メニューからマウスを外した時にメニューを閉じる処理がうまくいっておりません。onmouseoutを使うとできそうなのですが、メニューからではなく、リンクからマウスを外した時にメニューが消えてしまい困っています。解決のヒントになることでも結構ですので、アドバイスを頂けたらと思います。現在はclearTimeSetやclearTimeoutで制御できないかを調べている最中です。よろしくお願いいたします。 [HTMLのソース(一部抜粋)] <div id="testmenu1" style="position: absolute;visibility: hidden;(省略)"> <ul style="(省略)"> <li><a href="#">メニュー1</a></li> <li><a href="#">メニュー2</a></li> <li><a href="#">メニュー3</a></li> </ul> </div> <div id="testmenu2" style="position: absolute;visibility: hidden;(省略)"> <ul style="(省略)"> <li><a href="#">メニュー1</a></li> <li><a href="#">メニュー2</a></li> <li><a href="#">メニュー3</a></li> </ul> </div> <table> <tr><td> <a href="" onclick="return false;" onmouseover="testShowPopupMenu('testmenu1'); return false;" onmouseout="testHidePopupMenu('testmenu1'); return false;">メニュー1</a> </td></tr> <tr><td> <a href="" onclick="return false;" onmouseover="testShowPopupMenu('testmenu2'); return false;" onmouseout="testHidePopupMenu('testmenu2'); return false;">メニュー2</a> </td></tr> </table> [JavaScriptのソース(一部抜粋)] var mX = 0; var mY = 0; var pX = 5; // マウスから右に5ピクセルずらす var pY = 5; // マウスから下に5ピクセルずらす document.onmousemove = testGetMousePoint; // マウス位置取得 function testGetMousePoint() { 　mX = event.clientX + document.body.scrollLeft; 　mY = event.clientY + document.body.scrollTop; } // ポップアップメニューの表示 function testShowPopupMenu(id) { 　pop = document.getElementById(id).style; 　pop.visibility = "visible"; 　pop.left = mX + pX + "px"; 　pop.top = mY + pY + "px"; } // ポップアップの非表示 function testHidePopupMenu(id) { 　document.getElementById(id).style.visibility = "hidden"; }
ポップアップメニューからページジャンプ方法

htmlでonmouse時にjavaでaddmenuitem location="/Ａフォルダ/a.html"と"/Bフォルダ/b.html"という２行を選択出来るようにしています。topページから/Aフォルダ/a.htmlへジャンプはしますが、a.htmlからポップアップメニューで/bフォルダ/b.htmlを選択すると、ページが見つからず、urlには/a/b/b.htmlとなっており、ジャンプする前のaというフォルダが残ってしまいます。参考元は自社のものですが、今までの方が退職されてしまい、新規で作ろうと模索してます。 htmlに記載されている、cssやJSもコピーしております。この現象を回避するにはcssかjavaはhtmlのどこのどの部分を見れば良いか教えて下さい。
サイドバー用のプルダウンメニューの作成

こんにちは。現在、サイドバー用のプルダウンメニューを作成しようと考えています。下記のサイトのように、縦にメニューを並べるような感じです。下記サイトはオンマウス時に横にプルダウンが表示されていますが、これを縦にプルダウンが表示されるようにするにはどのようにjavascript、html、cssを作成すればいいでしょうか？下記サイトはCSSとhtmlで作られていますが、私はjavascriptを使うつもりでいます。どなたかご存知の方がいらっしゃりましたら、ぜひ教えてください。 http://www.stylish-style.com/csstec/ultimate/css-roll-2.html
アコーディオンメニュー開いたまま動かない

アコーディオンメニューを設置したく検索をかけサンプルを入手、手直ししながら設置を試みるのですが、サンプルからして「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 にて検証よろしくお願いします。
FlashとJavascriptのメニューについて

現在Javascriptのドロップダウンするサブメニューを作っています。（http://lolipop.jp/のような感じ）そのメニューの下にFlashムービーを配置したいのですが、ドロップダウンしてくるサブメニューはFlashの下に隠れてしまいます。つまり1つ下のレイヤーに表示されてしまいます。 Javascriptをいかしたまま、サブメニューをFlashの上に表示させる方法はありますか？ぜひ教えてください。宜しくお願いします。
プルダウンメニューに画像を使用するには？

JavaScript初心者です。過去の質問 http://oshiete1.goo.ne.jp/kotaeru.php3?q=1886905 にあるソースを利用してみたいのですが、メニューの頭にあるボタンを画像（オリジナルのアイコン）に変えたいのですが、どのようにすればよいでしょうか？ボタンのタグはなんとなく分かるのですが、差し替え方が全く分かりません。 ↓これが、そのソースです。宜しくお願いします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=SHIFT_JIS"> <title>サンプル</title> <style>  </style> <script type="text/javascript">  </script> </head> <body> <div><input type="button" value="＋" onClick="changeFold(this)">メニュー１<div class="inside"> もろもろ<br /> <a href="index.html">トップ</a><br /> <a href="sub.html">サブ</a><br /> </div> </div> <div><input type="button" value="＋" onClick="changeFold(this)">メニュー２<div class="inside"> また別のもろもろ<br /> <a href="index2.html">トップ２</a><br /> <a href="sub2.html">サブ２</a><br /> </div> </div> </body> </html>
CSSでポップアップメニューを作成したがIEだけメニューが表示されません。

下記のようなCSSでポップアップメニューを作成したのですが IEだけポップアップメニューが表示されませんでした。 IEでもポップアップメニューが表示されるようにするにはどのようにすればよいのでしょうか？（JavaScriptは未使用で作成） <html> <head> <style type="text/css"> #menu { position: relative; width: 102px; height: 22px; } #menu li { list-style-type: none; float: left; } #menu li a { color: gray; width: 100px; height:20px; text-decoration: none; text-align: center; border: 1px solid gray; display: block; } #menu li a:hover { background-color:#FFFFCC; } #menu ul li ul { display: none; } #menu ul li:hover ul { display:block; position:absolute; top: 22px; left: 0; } </style> </head> <body> <div id="menu"> <ul> <li> <a href="#">home</a> <ul> <li><a href="#">first</a></li> <li><a href="#">second</a></li> <li><a href="#">third</a></li> </ul> </li> </ul> </div> </body> </html>
CSS Dock Menu[jQuery]について

WEBサイトで「MacOS X風ドックメニュー」を実現させる[CSS Dock Menu]についての質問です。 http://www.ndesign-studio.com/blog/mac/css-dock-menu Demo通りの動きを実現する事はナビ通り行えば問題ないのですが、 Demo以外の機能として、何かフラグが立ったときにアイコンをぴょんぴょん飛び跳ねさせる事(これもOSX風に)は可能なのでしょうか。お詳しい方、ご教授ください。よろしくお願いいたします。
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>
マック風ドック型メニューとコンテンツスライダー

http://demo.tutorialzine.com/2009/11/beautiful-apple-gallery-slideshow/demo.html 上記サイトのコンテンツスライダーのメニュー部を下記サイトのマック風ドック型まニューにしたいのですが、できるのでしょうか？ http://creazy.net/2008/03/mac_style_dock_plus.html コンテンツスライダーの上にメニューを置いてクリックでメニューの下のコンテンツががスライドするようなものを作りたいのですがもし教えてくださる方がいらっしゃったらご教授下さい＞＜！
マウスオーバーのメニューについて

お世話になります。現在、オンマウスでメニュー画像が表示される仕組みを作成しているのですが、別のメニューにする方法がわかりません。たとえば、「MAIN」と「LINK」のメニューがあるとして、MAINはMAINのメニュー、LINKはLINKのメニューが表示されるという方法です。 http://memorva.jp/memo/html/js_css_menu_mover.php 上記のURLの方法なのですが。この場合、cssの数値を変えて（css12ならcss13）スクリプトを追加すればいいのでしょうが、その方法でやっても、同じ画像が表示されます。（css13のスクリプトを新しく書き加えたのにブラウザでプレビューするとcss12の内容が表示されてしまいます。） ↓HEAD内のCSS設定部分は下記のように分割して書いてます <script language="javascript">  </script> <script language="javascript">  </script> よろしくお願い致します。
サブドメインでメインドメインのCSSは使えますか?

構成:[]・・・フォルダ main.comをマイドメイン sub1.main.comをサブドメイン [main.com] ┣index.html ┣style.css ┗[sub1.main.com]━top.html　・・・サブドメインのフォルダこの場合サブドメインのtop.htmlで上のフォルダ（同じサーバー上）にあるstyle.cssを指定するには相対パスではできないのでしょうか？厳密にサブドメインとメインドメインは同じサーバー上にありますが、http://sub1.main.com/top.htmlと表示が異なってしまうからフォルダごとにCSSやJSを用意しなければいけないのでしょうか？

ポップアップメニュー

みんなの回答

関連するQ&A

プルダウンメニューについて教えてください。

ポップアップのメニューバーの作り方

macromediaのようなメニュー

menuのHTMLタグとCSSが上手くいかない

javascriptでポップアップメニュー

ポップアップメニューの作成方法

プルダウンメニューについて

HTMLのメニューをインクルードできますか？

ポップアップメニューの制御について

ポップアップメニューからページジャンプ方法

サイドバー用のプルダウンメニューの作成

アコーディオンメニュー開いたまま動かない

FlashとJavascriptのメニューについて

プルダウンメニューに画像を使用するには？

CSSでポップアップメニューを作成したがIEだけメニューが表示されません。

CSS Dock Menu[jQuery]について

jQueryでプルダウンメニュー

マック風ドック型メニューとコンテンツスライダー

マウスオーバーのメニューについて

サブドメインでメインドメインのCSSは使えますか?

注目のQ&A

カテゴリ
一覧

専門家に質問してみよう
専門家登録

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

ポップアップメニュー

みんなの回答

関連するQ&A

プルダウンメニューについて教えてください。

ポップアップのメニューバーの作り方

macromediaのようなメニュー

menuのHTMLタグとCSSが上手くいかない

javascriptでポップアップメニュー

ポップアップメニューの作成方法

プルダウンメニューについて

HTMLのメニューをインクルードできますか？

ポップアップメニューの制御について

ポップアップメニューからページジャンプ方法

サイドバー用のプルダウンメニューの作成

アコーディオンメニュー 開いたまま動かない

FlashとJavascriptのメニューについて

プルダウンメニューに画像を使用するには？

CSSでポップアップメニューを作成したがIEだけメニューが表示されません。

CSS Dock Menu[jQuery]について

jQueryでプルダウンメニュー

マック風ドック型メニューとコンテンツスライダー

マウスオーバーのメニューについて

サブドメインでメインドメインのCSSは使えますか?

注目のQ&A

カテゴリ 一覧

専門家に質問してみよう 専門家登録

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

アコーディオンメニュー開いたまま動かない

カテゴリ
一覧

専門家に質問してみよう
専門家登録