当元素包含通过CSS transition设置动画的其他元素时，偶尔不会触发单击事件。
测试用例：http://codepen.io/anon/pen/gbosy
我有一个布局，其中一系列图像具有在悬停时显示的标题。点击它们会触发相邻元素的.slideDown。他们自己可能会被用户快速点击。这个问题在实时网站上比在codepen中更明显。
在codepen中，我的大约90％的点击都被遵守，而当CSS过渡被禁用时，100％被遵守。
欢迎任何建议。
我应该注意到这个问题在Chrome中最容易复制，在Safari中不太常见，在Firefox中也很少见。
答案 0 :(得分：13)
我认为关键是禁用p元素中的鼠标事件：
p {
pointer-events: none;
}
问题出现是因为点击是从mousedown + mouseup生成的，如果你在转换的边缘执行，则mousedown在一个元素中，mouseup在另一个元素中（并且不会生成点击） 。
反过来（不是真的相同，但很可能用户不会注意到它）是在mousedown而不是点击