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

Question

我有两个菜单在彼此之上，它们根据特定 anchor 的点击在彼此之间转换。我们称它们为 .defaultMenu 和 .secondMenu， anchor 是 .showSecondMenu 要返回，您必须单击 .hideSecondMenu 。它们之间的过渡包括不透明动画。通常我使用 display: none 来忽略“隐藏”菜单的点击，但这次 display: none 不是一个选项。

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

整个想法是，当菜单从 .defaultMenu 过渡到 .secondMenu(和向后)时，事件菜单淡出，而新的隐藏菜单淡入。

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

Answer 1

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

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

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