7

您好，我在互联网上搜索了一下，但没有找到我真正想要的东西。但无论如何，我正在寻找的是，如果一个元素被隐藏，那么它将执行一个动作，然后如果该元素是可见的，它将执行另一个动作。在这种情况下，我正在构建一个显示/隐藏菜单，当您单击菜单图标（使用“.toggle”类）时，它会将不透明度更改为 1，当您隐藏菜单时，图标不透明度将再次更改为 0.6 .

无论如何，这是我的代码：

$(".sidebar_menu").hide();
$(".sidebar li.toggle").click(function(){
$(".sidebar_menu").animate({width: "toggle"}, 200);
// Here's where the code I can't figure out is gonna be.
});

希望大家能帮帮我，那就太好了！谢谢你。

4

1 回答 1

9

这适用于hidden和visible元素：

$(".sidebar_menu").hide();
$(".sidebar li.toggle").click(function(){
  $(".sidebar_menu").animate({width: "toggle"}, 200,
    function() {
      if($(this).is(':visible')){
        $(".toggle").css({opacity: 1});
      } else if ($(this).is(':hidden')) {
        $(".toggle").css({opacity: 0.6}); 
      }; 
    })
  });
});

编辑：与.toggle()

$(".sidebar_menu").hide();
$(".sidebar li.toggle").click(function(){
  $(".sidebar_menu").toggle('slow',
    function() {
      if($(this).is(':visible')){
        $(".toggle").css({opacity: 1});
      } else if ($(this).is(':hidden')) {
        $(".toggle").css({opacity: 0.6}); 
      }; 
    })
  });
});

在这里你可以看到一个小例子：FIDDLE

于 2013-06-18T19:05:09.847 回答