jquery - 如何在释放 mousedown 时停止 jquery 动画?

标签 jquery jquery-animate bind css mousedown

现在我设置了一个简单的按钮,它在按下鼠标时播放动画,在松开鼠标时反转该动画的效果。动画会更改“top”、“left”和“box-shadow”属性。为了让 jquery 的 .animate() 函数影响元素的框阴影,我不得不使用一个特殊的 jquery 插件。为了便于引用,这里有一个 GitHub repository of my current example .

问题是,即使立即释放鼠标按钮,动画也会在继续反转之前完成。期望的效果是用户通过按住或释放鼠标按钮来控制按钮是“向上”移动还是“向下”移动。参见 this example (右边的最后一个框)以了解我想要实现的目标。

到目前为止,在我的研究中,似乎应该使用绑定(bind)/解除绑定(bind)来完成此操作,但我看到的示例并未涉及在动画完成之前停止动画。

最佳答案

当你使用 jQuery 来制作动画时,

你可以使用 .stop() 来

Stop the currently-running animation on the matched elements.

你也可以使用 .finish() 来

Stop the currently-running animation, remove all queued animations, and complete all animations for the matched elements.

然后您可以在动画停止时恢复到元素的原始值。

关于jquery - 如何在释放 mousedown 时停止 jquery 动画?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20646338/

相关文章:

sockets - 为什么在 TCP 中使用 bind()?为什么它只用在服务器端而不用在客户端?

javascript - 将不同的文件类型发布到 php 文件上的不同 php block

关闭子窗口(弹出窗口)后Javascript刷新主页

css - animate.css bounceindown 在 Safari 中不起作用

jquery 左右滑动切换

java - Jquery 切换动画不透明度函数

javascript - document.querySelector.bind(document); 是什么意思?

javascript - 用于绑定(bind)回调序列的 Composer 函数

jquery - 使用 Data Cycle FX 的 jQuery 旋转木马菜单内的中心事件 li 元素

php - 有没有办法让ajax请求始终按顺序进行?