人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

jQuery タブからタブへのリンク

タブを使ったページを制作しており、クライアントからタブへのダイレクトリンクを貼りたいとの要望を受け、それはクリアーしました。

その後、タブからタブへのリンクをしたいとの要望を追加で受け、、ここにちょっと手小津っております。
調べたり、考えたりしたのですが、よくわからず、あまり時間もない案件のため、ご教授頂きたく質問させて頂きます。
コードは下記のようになっています。

< ul>
< li>< a href="#tab01">tab01</a></li>
< li>< a href="#tab02">tab02</a></li>
< li>< a href="#tab03">tab03</a></li>
</ul>

< div id="#tab01">
やりたいこと< a href="http://hogehoge.jp/#tab03">tab03へ行きたい</a>
</div>
< div id="#tab02">

</div>
< div id="#tab03">
ここへTABの中からのリンクで行きたい
</div>

コードの中に書いたのですが、タブの中に別タブへのリンクを付けて指定されたタブへ飛ばしたいというのが目的です。
次のタブへ飛ばすはうまく行ったのですが、指定したタブへ飛ばすコードが上手く書けず・・・。

具体的なコードを教えて頂けると幸いです。よろしくお願い致します。

●質問者: 匿名質問者
●カテゴリ:ウェブ制作
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

1 ● 匿名回答1号

質問文から察するにloadイベント拾ってハッシュを処理してるんだと思います。
ですので、
URLのハッシュを監視する(#, シャープ, フラグメント識別子) at softelメモ
↑こちらの記事を参考に、イベントを拾って同様の処理をすればいいと思います。

ご不明な点があれば補足お願いします。


匿名質問者さんのコメント
さっそくのご連絡ありがとうございます。 現在、タブのダイレクトリンクについては以下の様なコードで動かしています。 window.onload=function(){ var hash = location.hash; if(hash){ $(".news_list li a[href=" + hash + "]").click(); $(".text_detail a[href=" + hash + "]").click(); } parent.scroll(0,0); $('body,html').animate({scrollTop: 0}); } #をひろって、リンク後にはページの先頭を表示させるようにしています。 これに追記のような形で出来るものなのでしょうか? 色々試したのですが、うまく行かず・・。 もし、ご存知でしたらサンプル的なコードを教えて頂けると嬉しいです。

匿名回答1号さんのコメント
こんな感じで動くんじゃないかと思います。 >|javascript| window.onload=function(){ var hash = location.hash; if(hash){ $(".news_list li a[href=" + hash + "]").click(); $(".text_detail a[href=" + hash + "]").click(); } parent.scroll(0,0); $('body,html').animate({scrollTop: 0}); $(window).on('hashchange', function(){ var hash = location.hash; if(hash){ $(".news_list li a[href=" + hash + "]").click(); $(".text_detail a[href=" + hash + "]").click(); } }); } ||<
関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ