簡體   English   中英

反正有沒有停止可折疊的側面導航停止跳轉頁面加載?

[英]Is there anyway to stop collapsible side navigation to stop jumping on page load?

代碼工作,除了它每次加載或刷新頁面時都會跳躍,我想知道是否有人知道這個問題的解決方案? 任何幫助非常感謝。

按下這個Jsfiddle上的“運行”按鈕,看看我的意思。

            <div id="sideNav_header">Navigation</div>

            <ul id="collapsibleMenu">
                <li><a href="#">Link</a>
                    <ul>

                        <li><a href="#">Link</a></li>
                        <li><a href="#">Link</a></li>
                        <li><a href="#">Link</a></li>
                        <li><a href="#">Link</a></li>
                        <li><a href="#">Link</a></li>

                    </ul>
                </li>
                <li><a href="#">Link</a>
                    <ul>
                        <li><a href="#">List Item 2.1</a></li>
                        <li><a href="#">List Item 2.2</a></li>
                        <li><a href="#">List Item 2.3</a></li>

                    </ul>
                </li>
                <li><a href="#">Link</a>
                    <ul>
                        <li><a href="#">List Item 3.1</a></li>
                        <li><a href="#">List Item 3.2</a></li>
                        <li><a href="#">List Item 3.3</a></li>

                    </ul>
                </li>
                <li><a href="#">Link</a>
                    <ul>
                        <li><a href="#">List Item 4.1</a></li>
                        <li><a href="#">List Item 4.2</a></li>
                        <li><a href="#">List Item 4.3</a></li>

                    </ul>
                </li>
                <li><a href="#">Link</a>
                    <ul>
                        <li><a href="#">List Item 5.1</a></li>
                        <li><a href="#">List Item 5.2</a></li>
                        <li><a href="#">List Item 5.3</a></li>

                    </ul>
                </li>
                <li><a href="#">Link</a>
                    <ul>
                        <li><a href="#">List Item 1.1</a></li>
                        <li><a href="#">List Item 1.2</a></li>
                        <li><a href="#">List Item 1.3</a></li>

                    </ul>
                </li>
                <li><a href="#">Link</a>
                    <ul>
                        <li><a href="#">List Item 2.1</a></li>
                        <li><a href="#">List Item 2.2</a></li>
                        <li><a href="#">List Item 2.3</a></li>

                    </ul>
                </li>
                <li><a href="#">Link</a>
                    <ul>
                        <li><a href="#">List Item 3.1</a></li>
                        <li><a href="#">List Item 3.2</a></li>
                        <li><a href="#">List Item 3.3</a></li>

                    </ul>
                </li>
                <li><a href="#">Link</a>
                    <ul>
                        <li><a href="#">List Item 4.1</a></li>
                        <li><a href="#">List Item 4.2</a></li>
                        <li><a href="#">List Item 4.3</a></li>

                    </ul>
                </li>
                <li><a href="#">Link</a>
                    <ul>
                        <li><a href="#">List Item 5.1</a></li>
                        <li><a href="#">List Item 5.2</a></li>
                        <li><a href="#">List Item 5.3</a></li>

                    </ul>
                </li>
                <li><a href="#">Link</a>
                    <ul>
                        <li><a href="#">List Item 5.1</a></li>
                        <li><a href="#">List Item 5.2</a></li>
                        <li><a href="#">List Item 5.3</a></li>

                    </ul>
                </li>
            </ul>


//Script//
     $("#collapsibleMenu > li > a").find("+ ul").slideUp(1);

                // Expand or collapse:
                $("#collapsibleMenu > li > a").click(function() {
                    $(this).find("+ ul").slideToggle("slow");
                });​

是的,改變:

$("#collapsibleMenu > li > a").find("+ ul").slideUp(1);

至:

$("#collapsibleMenu > li > a").find("+ ul").slideUp(0);

http://jsfiddle.net/DjbeK/1/

在頁面加載時使用slideUp(1)沒有意義,你可以使用hide()代替。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM