初めまして。
まったくわからず、助けてほしいです。
JS/JQ 初心者です。
実現したいこと
ページ内のリンクをクリックすると別ページにあるアコーディオン内の該当箇所に飛ぶようにしたい。
■仕様
1.ページ内のリンクをクリックすると別ページへ行き該当のアコーディオンが開く
2.さらに開いたアコーディオン内の該当箇所(h4)に飛びたい
該当のソースコード
クリックするリンク index.html
<ul class="box"> <li> <a href="test.html#accordion01">テキストリンクテキストリンク</a> </li> <li> <a href="test.html#accordion02">テキストリンクテキストリンク</a> </li> </ul>
クリック後、別ページにあるアコーディオン test.html
<div id="accordion01" class="linkarea"> <h3>タイトルタイトル</h3> <div class="linkbox"> <h4>リンク1※アコーディオン内の該当箇所(リンク先をここに指定したい)</h4> <p>内容内容内容内容内容内容</p> <h4>リンク2※アコーディオン内の該当箇所(リンク先をここに指定したい)</h4> <p>内容内容内容内容内容内容</p> </div> </div> <div id="accordion02" class="linkarea"> <h3>タイトルタイトル</h3> <div class="linkbox"> <h4>リンク3※アコーディオン内の該当箇所(リンク先をここに指定したい)</h4> <p>内容内容内容内容内容内容</p> </div> </div>
js
//アコーディオン $(function() { $(".linkarea h3").on("click", function(){ $(this).next(".linkbox").slideToggle("slow"); $(this).next(".linkbox").toggleClass("active"); }); $(location.hash).children('.linkbox').slideToggle(); $(location.hash).find('.linkbox').toggleClass('active'); });
どのようにアコーディオン内の該当箇所に飛べばいいかが、まったくわかりません。。。
js/jQの詳しい方ご教授いただけると幸いです。
また、大変不慣れなため、ソースを記述していただけると幸いです。
大変お手数おかけしますが、よろしくお願いします。
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
退会済みユーザー
2019/05/09 09:52 編集
2019/05/09 10:06 編集
退会済みユーザー
2019/05/09 10:12
退会済みユーザー
2019/05/09 10:18