Question

我希望能够在孩子徘徊时缩小子div，当鼠标退出时，子div会按比例放大。我有它的工作，但是当我在初始缩小效果完成之前进入和退出子div时，我遇到了一个问题。如果我太快地进入和退出子div，则子div不会缩放。我知道我可以用CSS做到这一点，但在这个特殊的例子中，我需要JQuery才能工作。

我设置了一个简单的JSFiddle来显示我正在经历的事情。如果您非常快速地进入和退出蓝色框（在小提琴中）（如在框缩小之前退出），您可以看到蓝色框不会再次出现。

JSFiddle

HTML

<div id = "block-example">   
   <div id = "inner-block">   
   </div>
</div>

CSS

#block-example{
   width:100px;
   height:100px;
   padding:10px;
   background:red;
}

#inner-block{
   width:100px;
   height:100px;
   background:blue;
}

JQuery的

$('#block-example').hover(function () {
  $(this).children().hide({effect: 'scale', duration: 100});
},function(){
  $(this).children().show({effect: 'scale', duration: 100});
});

确保JQuery悬停效果在鼠标退出时恢复（即使初始悬停效果还没有完成）

0 个答案: