scroll - Jquery の使用 - HTML アンカー #hash メソッドを置き換えるボタンで div をターゲットにする

Question

#loadpanel1:targetビューアーにロードされた div 内でアニメーションを実行するようなものを使用しています。現在、#hashtagアンカー メソッドを使用してコンテナーをアクティブにしています。問題は、これがギャラリー スタイルのビューアーであり、すべてのリンクでページが一番上にジャンプすることです。私は2つのことのいずれかをしたいと思います:

1. #loadpanelリンクのジャンプを防止する
2. アンカー リンクを適切な Js 代替に置き換えます。

#holdall {
width:      0px;
height:     0px;
position:absolute;
background: white;
-webkit-transition: all 3s ease-out;
-moz-transition: all 3s ease-out;
-ms-transition: all 3s ease-out;
}
#loadpanel1:target #holdall { 
-webkit-transform: translateY(0px); 
-moz-transform: translateY(0px);
-ms-transform: translateY(0px);



    div id="viewer">
        <!-- Target divs -->
        <div id="loadpanel1">

        <!-- Hold All -->
        <div id="holdall">
            <div class="panel" id="panel1">
                <div class="info">
                    <h2>title</h2>
                    <p>test</p>

                </div>
            </div>
            <div class="panel" id="panel2">
                <div class="info">
                    <h2>title2</h2>
                    <p>test2</p>

                </div>

            </div>
            <div class="panel" id="panel3">
                <div class="info">
                    <h2>title3</h2>
                    <p>test3</p>


                </div>
            </div>
            <div class="panel" id="panel4">
                <div class="info">
                    <h2>title4</h2>
                    <p>test4</p>

                </div>
            </div>
            <div class="panel" id="panel5">
                <div class="info">
                    <h2>title5</h2>
                    <p>test5</p>

                </div>
            </div>
            <div class="panel" id="panel6">
                <div class="info">
                    <h2>title6</h2>
                    <p>test6</p>

                </div>
            </div>
        </div>
        <!-- End Hold All -->
        </div>
        </div>
        </div>
        </div>
        </div>
        </div>
        <!-- End Target divs -->
    </div>
    <div id="nav">
        <ul>
            <li><a href="#loadpanel1">1</a></li>
            <li><a href="#loadpanel2">2</a></li>
            <li><a href="#loadpanel3">3</a></li>
            <li><a href="#loadpanel4">4</a></li>
            <li><a href="#loadpanel5">5</a></li>
            <li><a href="#loadpanel6">6</a></li>
        </ul>
    </div> 
</div>