jQuery .slideToggle()重复

Question

因此，当我使用hover属性调用一个向下滑动一些文本的函数时。它工作得很好，但当您将鼠标多次移动到它上面时，它会继续重复。向上和向下滑动，直到它等于您在其上移动鼠标的次数。

JSFiddle

HTML：

<img src="img/icons/Garry's Mod.png" id="gmod-game" />
                <p id="gmod-info">Garry's Mod is a sandbox game that gives it's players access to props, entities, and other things that they can build with. They can also make their own servers where they can make their own gamemodes and add-ons, The game currently hase 45+ different gamemodes with many more server running that gamemode.</p>

CSS：

#gmod-info {
  position: absolute;
  width: 300px;
  height: 120px;
  color: white;
  margin-left: -300px;
  margin-top: -130px;
  display: none;
}

Answer 1

同一元素上的JQuery动画会排队。也就是说，如果在上一个动画尚未结束时启动一个动画，则上一个动画将继续运行，而新动画将在上一个动画完成后才开始。

您可以在开始下一个动画之前调用.stop()来停止任何动画。

$('#gmod-info').stop().slideToggle('slow');

jsfiddle

除了添加了对.stop()的调用外，此jsfiddle与原始jsfiddle相同。