可折叠菜单变化

对于本页面这个可折叠菜单： http://2ddige.com/temps/Services/proteomics%202d_dige_copy%281%29.html 可折叠菜单变化

需要在代码中进行，这样只有“基于凝胶的蛋白质组学”部分被扩大，其他3类坍塌什么样的变化？的Javascript：

// Appear/Disappear 
      $('#menu4 > li > a.expanded + ul').show(); 
      $('#menu4 > li > a').click(function() { 
       $(this).toggleClass('expanded').toggleClass('collapsed').parent().find('> ul').toggle(); 
      }); 
      $('#example4 .expand_all').click(function() { 
       $('#menu4 > li > a.collapsed').addClass('expanded').removeClass('collapsed').parent().find('> ul').show(); 
      }); 
      $('#example4 .collapse_all').click(function() { 
       $('#menu4 > li > a.expanded').addClass('collapsed').removeClass('expanded').parent().find('> ul').hide(); 
      });

HTML：扩张状态被称为类管辖“扩大

的CSS： .leftmenu a.expanded { 背景：网址（” ../图像/ collapse8。 PNG'）不重复的50％; 线高度：35px; 颜色：＃333333; 字体大小：11像素; 宽度：243px; 填充左：30像素;

} 
    .leftmenu a.collapsed { 
     background: url('../Images/expand8.png') no-repeat 50%; 
     line-height: 35px; 
     color: #333333; 
     font-size: 11px; 
     width: 243px; 
     padding-left:30px; 
}

我尝试将类更改为“折叠”，但它所做的更改了背景图像，并且该块仍在展开。

任何帮助表示赞赏。谢谢。

来源

2012-11-20 Psycho Pass

如果你改变了类，你想关闭collapsed的菜单项，那么你可以在JavaScript有菜单添加以下线收载：

$('#menu4 > li > a.collapsed + ul').hide();

您的JavaScript现在应该是这样的：

// Appear/Disappear 
$('#menu4 > li > a.expanded + ul').show(); 
$('#menu4 > li > a.collapsed + ul').hide(); 
$('#menu4 > li > a').click(function() { 
    $(this).toggleClass('expanded').toggleClass('collapsed').parent().find('> ul').toggle(); 
}); 
$('#example4 .expand_all').click(function() { 
    $('#menu4 > li > a.collapsed').addClass('expanded').removeClass('collapsed').parent().find('> ul').show(); 
}); 
$('#example4 .collapse_all').click(function() { 
    $('#menu4 > li > a.expanded').addClass('collapsed').removeClass('expanded').parent().find('> ul').hide(); 
});

来源

2012-11-20 22:38:44 3dgoo

非常感谢你的明确答案！有用！ –

可折叠菜单变化

回答

相关问题