- ベストアンサー
jqueryのスライドするナビゲーションについて
- jqueryを使用したスライドするナビゲーションについての質問です。
- 特定のコンテンツに合わせてスライドするラインを停止させる方法を教えてください。
- 現在、横スクロールサイトを作成しており、jqueryのMagicLine Navigationを使用してスライドするメニューを配置しています。
- みんなの回答 (1)
- 専門家の回答
質問者が選んだベストアンサー
質問の意味をよく理解できてませんが… >これを止める方法があれば実現させたいのですが、 magicLineが戻る位置を制御したいということでしょうか? もともとの作者の意図はclass="current_page_item"となっているli要素の位置を表示ページと判断してそこへ戻るようにしているのですが、最初にdataに記録を写しているの関係から必ずしもclass設定と連動するようにはなっていませんし、そのような使い方も想定されていないと思われます。 付け焼刃的な対処でよければ、対象とするli要素の位置と、幅をmagicLineのdataとしてセットし直してあげればよろしいかと。 その際に、animation中だとその時の戻り位置だけはすでに設定済みになっているので、無駄が多いですがアニメーションも再セットしておく必要があります。 イベントのきっかけは別になるのでしょうが、例えば『メニューをクリックしたら次からそこに戻るようにする』という例で書いてみると $("li a", $mainNav).click(function(){ $magicLine .data("origLeft", $(this).position().left) .data("origWidth", $(this).parent("li").width()) .stop().animate({ left: $magicLine.data("origLeft"), width: $magicLine.data("origWidth") }); }); みたいな方法で可能です。 しかし、重複が多いですし、作者の意図とはかなり違うので、構成を変えて作り直した方が良さそうに思われます。 そもそもの意味が違っていたら、無視してください。
お礼
すごいです!!!まさに実現したいことでした! 各コンテンツが別ファイルだと、クラス指定で簡単にできたのですが、今回同じファイル内だったので、苦戦しておりました。。ご丁寧にどうもありがとうございました!!感謝いたします。