jQuery .slideToggle()重复

时间:2016-09-10 18:48:39

标签: javascript jquery html css

因此,当我使用悬停属性来调用滑动某些文本的函数时。它工作正常,但当你将鼠标移动多次时,它会继续重复。向上和向下滑动,直到它等于您将鼠标移到它上面的次数。

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;
}

1 个答案:

答案 0 :(得分:4)

相同元素队列上的JQuery动画。也就是说,如果您在前一个动画尚未完成时启动动画,则前一个动画将继续运行,并且新动画将在前一个动画完成之后才会开始。

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

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

jsfiddle

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