Question

我正在通过动画更改对象的边框颜色：

    $listItem.siblings('li').andSelf().find('img').animate({ 
            borderTopColor: defaultThumbBorderColor,
            borderBottomColor: defaultThumbBorderColor,
            borderLeftColor: defaultThumbBorderColor,
            borderRightColor: defaultThumbBorderColor
          }, 500 );

在Firefox中，这有效。但是，我在控制台日志中收到此错误：

Warning: Expected number or percentage in rgb() but found 'NaN'.  Error in parsing value for 'border-bottom-color'.  Declaration dropped.

好像jQuery想要这些属性的数字。但即使我传入一个字符串（例如'red'），它也能正常工作，但会记录错误。

知道为什么吗？

奖金问题：我似乎无法通过'borderColor'或'border-color'将所有四种边框颜色应用于一行。如上所述，唯一的方法就是设置四边中每一面的颜色吗？我遇到的问题是它通常有效。但偶尔它不会在阵列中看似随机的项目上为四个边界中的一个设置动画。所以，一个示例场景：如果我有20个项目，它将为18个项目的所有四个边框设置动画，然后在其中2个项目上设置3个边框。如果重要的话，我将边框附加到图像上。也许这就是罪魁祸首？我会做一些测试......

更新......好吧，如果它特别是图像，这不是问题。我似乎可能是一个性能故障（也许是浏览器？也许是jQuery？）

如果我有一组元素，我需要同时更改所有4种边框颜色，大部分时间都可以使用，但也许1个我们的3次，20个左右的元素中的1个或2个只会动画3个边界，而不是全部四个。

此时，我想我只需要填充div并使用背景颜色。

Answer 1

我假设您正在使用官方jQuery动画来着色插件。如果您检查它的来源，您可以看到它覆盖以下属性：

// We override the animation for all of these color styles
jQuery.each(['backgroundColor', 'borderBottomColor', 'borderLeftColor', 'borderRightColor', 'borderTopColor', 'color', 'outlineColor'])

这解释了为什么borderColor不会将所有边框设置为指定颜色的动画。

谈到NaN问题，我认为这是一个错误。当我试图将30个对象同时设置为特定的背景颜色时，我遇到了同样的问题。有些动画只是随机停止。因此，填充和背景的解决方法可能不起作用。

Answer 2

大部分时间都有效，但可能是1 我们的3次，20次中有1次或2次或者元素只会动画3个他们的边界而不是全部四个。

我遇到了同样的问题。

显然，彩色动画插件中存在一个错误，现在已经修复了。（http://dev.jqueryui.com/ticket/4251）

以下是他们改变的两行......

http://dev.jqueryui.com/changeset/3269

我在插件中添加了上述更改，并且从那时起就没有任何问题。

希望这有用。

特拉维斯

尝试设置边框颜色时jQuery收到NaN错误（但它有效吗？）

2 个答案: