jquery单击处理程序不关闭菜单中的幻灯片

Question

相关的JSFiddle：http://jsfiddle.net/7u2fy/

我试图让菜单中的幻灯片按下单击按钮滑动，当您按下转义或单击菜单外的任何位置时滑出。我还想在菜单处于活动状态时使屏幕的非菜单部分变暗。

我的问题是jquery点击处理程序无法关闭菜单。

jsfiddle看起来有点奇怪，即使在我的实际项目中它看起来很好，只有jquery点击处理程序不起作用。

无效的具体代码......

$('#site-wrapper.show-nav #site-canvas').click(function () {
    toggleNav();
});

Answer 1

您的点击处理程序工作正常，问题是此元素上显示的灰色块：＃site-wrapper.show-nav＃site-canvas：after

它实际上阻止了任何点击，删除了下面的属性'绝对'，你可以点击。

#site-wrapper.show-nav #site-canvas:after {
  *position: absolute;*
}

问题出在你的CSS而不是你的JS中，请看这个点击工作的小提琴：http://jsfiddle.net/7u2fy/1/