• 締切済み

タブの切り替えについて

こちら(http://5am.jp/jquery/jquery_ui_tabs/)のサイトを参考に JSはそのまま使用し、CSSのみ少し手を加えて、タブの切り替えを作成したのですが、 タブを切り替える度にページトップへスクロールしてしまいます。 JSに手を加えてこれを回避する方法はあるのでしょうか?

みんなの回答

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

#1です。 >JSはそのまま使用し、CSSのみ少し手を加えて ではなくて、JSも変わっているようですね。 ご提示のサイトのリンクが切れているので同じものなのかわかりませんが、配布元のサイト(多分これだと思いますが)にドキュメントや説明があるようですので、そちらできちんと確認なさるのがよろしいかと思います。(スクリプトだけでなくHTMLやCSS、設置方法なども含めて) (私は、英語が苦手なのでさっぱりですが…) http://jqueryui.com/demos/tabs/

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

回答が無いようなので… 内容は見ていませんが、ご提示のサイトのデモではページトップへ戻らないようですが、質問者様の環境でも同様と推測しますが? それなので、 >タブを切り替える度にページトップへスクロールしてしまいます をどうやって実現しているのか、ご質問文からでは不明なので回答のしようがないといったところではないでしょうか。 >JSに手を加えてこれを回避する方法はあるのでしょうか スクリプトで対処は可能だと推測しますが、どうするのが適切なのかは、原因がわからないので不明です。 それよりも、スクリプトで対処するのが適切なのかどうかも疑問に感じます。 推測するところ、 >CSSのみ少し手を加えて が原因かもしれませんから、元に戻してみるとか。 あるいは、手を加えないものがご希望通りに動作することを確認なさってから、改変するとかしてみればわかるかも。

pinkclou10
質問者

お礼

そうですね。落ち着いて見返すと質問し方に問題がありましたね。失礼しました。 参考にしたサイトの <script type="text/javascript"> $(function() { $('#ui-tab > ul').tabs({ fx: { opacity: 'toggle', duration: 'normal' } }); }); </script> ではなぜかトップへ戻り <script type="text/javascript"> $(function() { $('#ui-tab > ul').tabs(); }); </script> ではトップへ戻らないという状況だったので、 JSに手を加えることで解決するのかと思っておりました。

関連するQ&A