jquery - 两个菜单之间的转换和隐藏/忽略二级菜单的可点击性

Question

我有两个相互重叠的菜单，它们根据单击特定锚点而相互转换。让我们称它们为.defaultMenuand .secondMenu，锚点是.showSecondMenu并且要返回，您必须单击.hideSecondMenu。它们之间的过渡包括不透明动画。通常我display: none习惯于忽略“隐藏”菜单的点击，但这一次display: none不是一个选项。

我已经找到了一个使用的主题pointer-event: none，但这不适用于 IE9/10。因此，我正在寻找一种简单的方法来在两个相互重叠的菜单之间进行转换，但只有活动菜单项是可点击的。

整个想法是，当菜单从.defaultMenu到.secondMenu（和向后）转换时，活动菜单会淡出，而新的隐藏菜单会淡入。

如前所述，它应该与 IE9/10 兼容。

Answer 1

哇，我几乎会给自己一个-1。显然，有一种非常简单的方法可以实现这一点。.fade().

$('a.showSecondMenu').click(function(event) {
  event.preventDefault();
  $('.defaultMenu').fadeOut();
  $('.secondMenu').fadeIn();
});

并反转此脚本以隐藏第二个菜单并显示默认菜单。