ようこそ ゲスト さん、新規登録(無料)して気になる疑問を解決しませんか?

質問

質問者:masa_tokai マウスオーバーでゆっくり出る縦型アコーディオンメニューの作り方を教えてください。 
困り度:
  • すぐに回答を!
マウスオーバーで、ゆっくり開くアコーディオンメニューを作成したいと考え色々、調べたのですがなかなかしっくりくるものがなくて困っています。
そこで、以下のサイトのドロップダウンメニューを改良してアコーディオンとして使えたらいいなと考え、自分なりにかまってみたのですが、上手くいきません。
参考サイト:​http://www.leigeber.com/2008/04/sliding-javascript-dropdown-menu/

どなたか助言をよろしくお願いいたします。
質問投稿日時:09/10/06 12:12
質問番号:5345892
この質問に対する回答は締め切られました。
最新から表示回答順に表示

回答

 

回答者:fujillin #1です。

作るのが目的なら良いのですが、使うのが目的ならそのようなライブラリを探す方が手っ取り早いのではないでしょうか。

縦型というなら、ご提示されているサイトにこのようなものもありますが?
意味が違うのかも
http://www.leigeber.com/2008/05/vertical-flyout-javascript-menu/


普通にアコーディオンと言えば、例えば
http://docs.jquery.com/UI/Accordion#event-change
http://www.i-marco.nl/weblog/yui-accordion/#basic
とか。これらは設定でクリックでもマウスオーバーでも対応できます。


あと、ちゃんと調べたわけじゃないけれど…
http://sandbox.leigeber.com/accordion/index.html
http://tutorialblog.org/10-javascript-accordion-scripts/
http://hyper-text.org/archives/2006/12/slidemenu_sample.shtml

などなど検索すれば沢山見つかると思います。
種類:アドバイス
どんな人:一般人
自信:参考意見
回答日時:09/10/06 14:09
回答番号:No.2
この回答へのお礼ありがとうございます。
​​http://hyper-text.org/archives/2006/12/slidemenu_sample.shtml&#...​リンクを張っていただきました上記のURLが私の求めていたアコーディオンメニューに近かったです。
これを応用して、自分の求めているものに改良したいと思います。
本当にありがとうございました。

​

回答

 

回答者:fujillin >自分なりにかまってみたのですが、上手くいきません。
どう、かまってみたのでしょうか?

最初の目立つところに DDSPEED、DDTIMERの設定があるので、それを操作すればどうにでもなりそう…
(多分、作者が編集できるようにと配慮しておいているのだと思う)
種類:アドバイス
どんな人:一般人
自信:参考意見
回答日時:09/10/06 12:54
回答番号:No.1
この回答へのお礼早々にお返事ありがとうございます。
すいません。私の言葉足らずでした。
上記のURLは、ドロップダウンメニューとなっています。
私の作りたいのは、アコーディオンメニューです。
上記のメニューを以下のように自分なりに縦にしました。

<dl class="dropdown">
<dt id="one-ddheader" onmouseover="ddMenu('one',1)" onmouseout="ddMenu('one',-1)">1階</dt>
<dd id="one-ddcontent" onmouseover="cancelHide('one')" onmouseout="ddMenu('one',-1)">
<ul>
<li><a href="#" class="underline">あああああああああああ</a></li>
<li><a href="#" class="underline">いいいいいいいいいいい</a></li>
<li><a href="#" class="underline">ううううううううううう</a></li>
<li><a href="#" class="underline">えええええええええええ</a></li>
<li><a href="#">おおおおおおおおお</a></li>
</ul>
</dd>
<dt id="two-ddheader" onmouseover="ddMenu('two',1)" onmouseout="ddMenu('two',-1)">2階</dt>
<dd id="two-ddcontent" onmouseover="cancelHide('two')" onmouseout="ddMenu('two',-1)">
<ul>
<li><a href="#" class="underline">Navigation Item 1</a></li>
<li><a href="#" class="underline">Navigation Item 2</a></li>
<li><a href="#" class="underline">Navigation Item 3</a></li>
<li><a href="#" class="underline">Navigation Item 4</a></li>
<li><a href="#">Navigation Item 5</a></li>
</ul>
</dd>
</dl>

しかし、元々横のメニューを縦に無理やりしたので、「1階」にマウスを持っていくと「2階」が隠れてしまうのです。
これを「1階」にマウスを持っていくとアコーディオンメニューみたいに「2階」も一緒に下にずれる。
と言うのを作りたいです。
よろしくお願いいたします。
最新から表示回答順に表示