在Twitter Bootstrap中，我如何阻止所有的手风琴在页面加载时瞬间展开

In Twitter Bootstrap, how would I stop all the accordions from momentarily unfolding on page load?

本文关键字：手风琴 加载 瞬间 Bootstrap Twitter 何阻止      更新时间：2023-09-26

参照以下页面:

http://www.myorange.ca/theme/jarvisadmin/

在页面加载时，左侧的所有手风琴暂时展开，然后再次隐藏。如何在页面加载时阻止这种瞬间展开?

给出所有假定为闭合的非开LI的一类closed

改变你的导航HTML在主菜单中添加class="closed" 

<ul class="menu" id="accordion-menu-js">
    <li class="closed"><a href="javascript:void(0)"><i class="icon-off"></i>Dashboard <span
        class="badge">2</span></a>
        <ul>
            <li><a href="index.html">Dashboard</a> </li>
            <li><a href="javascript:void(0);" class="logout-js" data-rel="login.html">Logout</a>
            </li>
        </ul>
    </li>
    <li class="closed"><a href="inbox.html" class="expanded"><i class="icon-envelope"></i>
        Inbox</a> </li>
    <li class=""><a href="javascript:void(0)"><i class="icon-check"></i>Forms<span class="badge">3</span></a>
        <ul>
            <li><a href="forms.html">Form Elements</a> </li>
            <li><a href="validation.html">Validation</a> </li>
            <li><a href="wizard.html">Wizards</a> </li>
        </ul>
    </li>
    <li class="closed"><a href="javascript:void(0)"><i class="icon-user"></i>Interface<span
        class="badge">3</span></a>
        <ul>
            <li><a href="interface.html">Interface Elements</a> </li>
            <li><a href="buttons.html">Buttons &amp; Icons</a> </li>
            <li><a href="tables.html">Tables</a> </li>
        </ul>
    </li>
    <li class="closed"><a href="javascript:void(0)"><i class="icon-signal"></i>Charts &amp;
        Graphs<span class="badge">3</span></a>
        <ul>
            <li><a href="basic_charts.html">Basic Charts</a> </li>
            <li><a href="adv_charts.html">Advanced Charts</a> </li>
            <li><a href="raphael.html">Raphael Engine</a> </li>
        </ul>
    </li>
    <li class="closed"><a href="widgets.html"><i class="icon-refresh"></i>Smart Widgets</a>
    </li>
    <li class="closed"><a href="javascript:void(0)"><i class="icon-plus"></i>Bonus<span
        class="badge">4</span></a>
        <ul>
            <li><a href="invoice.html">Invoice</a> </li>
            <li><a href="typography.html">Typography</a> </li>
            <li><a href="chat.html">Chat</a> </li>
            <li><a href="error-page.html">Error Page</a> </li>
        </ul>
    </li>
</ul>
相关文章：