jquery .animate() 没有动画

Posted 2023-05-08

【中文标题】jquery .animate() 没有动画

【英文标题】：jquery .animate() not animating

【发布时间】：2012-06-23 13:53:29

【问题描述】：

我正在尝试使元素周围的边框淡入。

按照jquery animate .css的答案，我使用了.animate() jquery函数并按照教程on the jquery site进行操作。

但是，我无法让它工作。这是我在 jsbin 上的代码： http://jsbin.com/epojaw/2 悬停在文本上应该会在它周围的边框中消失，但它只是突然出现。

这是为什么？

【参考方案1】：

您通过将边框的宽度从 0px 更改为 1px 来使用淡入效果。我假设步长是 1px，所以是的，它会立即出现。

相反，您可以尝试使用边框颜色创建淡入淡出，例如从白色变为红色。那么jQuery可以有更多的步骤，你的效果会更好。

【讨论】：

我要更改边框颜色吗？有没有可能做borderColor:rgba(x,x,x,0)？

查看***.com/questions/813493/… 了解更多关于动画边框颜色的信息。

@KevinDuke 我刚刚测试了它，但它没有。理论上，您可以使用 step 函数手动创建自己的。

确实，根据我提供的问题，您需要使用 borderTopColor （和其他 3 个）来制作动画。其中一个答案建议使用为您执行此操作的插件。

borderTopColor 不起作用，根据bitstorm.org/jquery/color-animation 这是 jquery 中的一个错误

【参考方案2】：

这是因为边框仅将边框的宽度设置为 1 x 1。

如果您将边框宽度设置为 10 像素，它会生成动画：http://jsbin.com/utiwoy/3