• 締切済み

縦と横へ同時にアニメーションするスライドメニュー

javacriptで縦もしくは横へスライドするアコーディオンメニューの サンプルスクリプトはよくあるのですが、ボタンをクリックまたはロールオーバーすると そのボタンから同時に縦と横へメニューが伸びていくようなメニューを作成したいと思っています。 (ボタンを基点にL字型にのびていくようなかんじです) http://net.tutsplus.com/tutorials/javascript-ajax/quick-tip-display-elements-sequentially-with-jquery/ で紹介されているjQueryのスクリプトは近いのですが、これはクリックすると 一つ一つliタグでコーディングされた部分がスライド的に現れるものですが このスクリプトの場合開くにあたる動作しかできません。 ロールオーバーで展開し、マウスアウトで閉じたいと思っています。 できれば開くときの逆方向のアニメーションでできればベストなのですが こういった動きをどうすればよいのか、 こういった動きが再現できるプラグインやスクリプトの書き方など、 ご存知のかたがいらっしゃいましたらご教授お願いします。

みんなの回答

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

どのような動きを想定していらっしゃるのかよくわからないのと、参考サイトは良く見ていませんけれど、その内容でほぼよろしいのなら… >これはクリックすると >一つ一つliタグでコーディングされた部分がスライド的に現れるものですが >このスクリプトの場合開くにあたる動作しかできません。 例えば、 クリックイベントで設定している部分を、click → hoverあるいはmouseoverなどで動作させ、閉じる時はfadeIn → fadeOutなどのようにほぼ反対の動作がjQueryに用意されていますので、同じ要領で逆の処理をさせるようにすればよろしいのではないでしょうか。

関連するQ&A