头痛的jquery 菜单,请高手们帮忙啊

Question

网上找了一个jquery 菜单，动态效果不错，
]
但是菜单页面打开时，默认总是第一项弹开的，
如何设置增加一个CSS参数，使得默认弹开项是可控的。具体效果及代码下载>>

Answer 1

给a增加一个open样式，过滤找到有open这个样式的a打开对应的菜单就行了<div id="wrapper-250">
  <ul class="accordion">    <li id="one" class="files"> <a href="#one">My Files<span>495</span></a>
      <ul class="sub-menu">
        <li><a href="#"><em>01</em>Dropbox<span>42</span></a></li>
        <li><a href="#"><em>02</em>Skydrive<span>87</span></a></li>        <li><a href="#"><em>03</em>FTP Server<span>366</span></a></li>
        <li><a href="#"><em>04</em>Dropbox<span>1</span></a></li>
        <li><a href="#"><em>05</em>Skydrive<span>10</span></a></li>
      </ul>    </li>
    <li id="two" class="mail"> <a href="#two">Mail<span>26</span></a>
      <ul class="sub-menu">
        <li><a href="#"><em>01</em>Hotmail<span>9</span></a></li>
        <li><a href="#"><em>02</em>Yahoo<span>14</span></a></li>      </ul>
    </li>
    <li id="three" class="cloud"> <a href="#three" class="open">Cloud<span>58</span></a><!-------增加open样式，则打开这个-------->
      <ul class="sub-menu">
        <li><a href="#"><em>01</em>Connect<span>12</span></a></li>
        <li><a href="#"><em>02</em>Profiles<span>19</span></a></li>        <li><a href="#"><em>03</em>Options<span>27</span></a></li>
        <li><a href="#"><em>04</em>Connect<span>12</span></a></li>
        <li><a href="#"><em>05</em>Profiles<span>19</span></a></li>
        <li><a href="#"><em>06</em>Options<span>27</span></a></li>      </ul>
    </li>
    <li id="four" class="sign"> <a href="#four">Sign Out</a>
      <ul class="sub-menu">
        <li><a href="#"><em>01</em>Log Out</a></li>
        <li><a href="#"><em>02</em>Delete Account</a></li>        <li><a href="#"><em>03</em>Freeze Account</a></li>
      </ul>
    </li>
  </ul>
</div>
<style>
.sub-menu{display:none}
</style>
<script type="text/javascript"  src="http://www.coding123.net/js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// Store variables
var accordion_head = $('.accordion > li > a'),
accordion_body = $('.accordion li > .sub-menu');
// Open the first tab on load
//accordion_head.first().addClass('active').next().slideDown('normal');
accordion_head.filter(".open").addClass('active').next().slideDown('normal');///////////////
// Click function
accordion_head.bind('click', function(event) {
// Disable header links
event.preventDefault();
// Show and hide the tabs on click
if ($(this).attr('class') != 'active'){
accordion_body.slideUp('normal');
$(this).next().stop(true,true).slideToggle('normal');
accordion_head.removeClass('active');
$(this).addClass('active');
}
});
});
</script>

Answer 2

注掉一行即可，注释掉此行accordion_head.first().addClass('active').next().slideDown('normal');
$(document).ready(function() {
// Store variables
var accordion_head = $('.accordion > li > a'),
accordion_body = $('.accordion li > .sub-menu');
// Open the first tab on load
//accordion_head.first().addClass('active').next().slideDown('normal');//---注掉慈航
// Click function
accordion_head.on('click', function(event) {
// Disable header links
event.preventDefault();
// Show and hide the tabs on click
if ($(this).attr('class') != 'active'){
accordion_body.slideUp('normal');
$(this).next().stop(true,true).slideToggle('normal');
accordion_head.removeClass('active');
$(this).addClass('active');
}
});
});

Answer 3

版主,,你说的方式,我不是太理解,也初步测试了一下,没有达到效果.能否送佛送到西,把最终修改后,并达到预期效果后的全部代码发给我邮箱 [email protected]  多谢了啊2楼，你的方案只是解决了初始状态时全部关闭的，我的期望就是在页面显示后，能指定某项是默认打开的，谢谢楼上各位的帮助，期待中