jQuery 处理鼠标悬停（）和未完成的动画

Question

带有可见代码的现场演示； http://jsfiddle.net/3eEgb/4/

演示应该是不言自明的；我在一个隐藏了溢出的包装器中找到了一个句子的长度，如果它比包装器更宽，我正在运行一个动画功能，它会滑动它，显示剩余的文本。

但是，我在使用 hover() 函数的 mouseout 部分时遇到了问题。当用户鼠标移出时，我希望文本快速回到它的起始位置。

根据文档 (http://api.jquery.com/stop/)，我应该能够 .stop() 对象上的动画 - 但我必须遗漏一些细节，因为我无法让它按文档说明工作。如果我能让 .stop() 发挥作用，我想我可以将它与 .css() 链接起来设置 margin:0 以将文本移回原来的位置。

$(this).stop().css("color", "red"); //This isn't working ARR!

是我沮丧的根源。我已经尝试了所有我能想到的各种方法，但都无济于事。

谢谢！

Answer 1

您正在为.width 元素设置动画，但正在停止.track-version 元素。

将 mouseleave 处理程序更改为 $(e).find(".width").stop()。