0

这是继这个问题之后的另一个问题。

$('.overlay').bind("mouseenter",function(){
  $(this).fadeTo('slow', 0);
}).bind("mouseleave",function(){
  var $this = $(this);                               
  setTimeout(function() { 
    $this.fadeTo('slow', 1);
  }, 2000);
})

在我的 .overlay div 下，我有一些我想要点击的内容。因此，在这种情况下， .overlay 的不透明度变为 0，但仍覆盖了下面的内容。

如果我在这里使用fadeOut()和fadeIn()，.overlay 将完全消失，并且脚本认为我已将鼠标移出，即使我仍将鼠标悬停在 .overlay 上。

4

1 回答 1

0

即使不透明度为零，叠加层仍在吞噬鼠标事件。实际上，您的解决方案取决于此，因为您无法触发叠加层上的mouseenterandmouseleave事件，并且仍然具有可点击的元素。

最好的办法可能是在容器 div 中创建叠加层和兄弟元素下方的元素。容器应该有mouseenter和mouseleave动作绑定到它，当覆盖完全淡出时，它也应该被隐藏。这将允许您访问单击它“下方”的元素。

关键是要能够单击覆盖下方的元素，它必须被隐藏或不覆盖下面的元素，即使它是完全透明的。

顺便说一句，我认为这种行为是特定于浏览器的。例如，在 IE 中，您可能被允许在透明覆盖层下方单击，但在 FF 中则不能。

于 2009-09-18T17:19:16.300 回答