jQuery 动画边框似乎不起作用答案

【问题标题】：jQuery Animate Border Doesn't seems to workjQuery 动画边框似乎不起作用
【发布时间】：2012-10-07 11:22:31
【问题描述】：

jQuery Animate 边框在这段代码中似乎不能正常工作： http://jsbin.com/ewuyup/13/edit

有人有办法解决吗？

我在 Animate 的 jQuery 网站上看到了这个。

不完全支持简写 CSS 属性（例如字体、背景、边框）。例如，如果要对渲染的边框宽度进行动画处理，则至少必须预先设置“auto”以外的边框样式和边框宽度。或者，如果你想动画字体大小，你会使用 fontSize 或 CSS 等效的 'font-size' 而不是简单的 'font'。

希望有人可以帮助我。

【问题讨论】：

标签： jquery html css jquery-animate

【解决方案1】：

我设法做到了：在 css 中设置边框样式和颜色，并将borderWidth:"2px", 放入您的动画中：

http://jsbin.com/ewuyup/20/

【讨论】：

【解决方案2】：

您不能为边框的颜色和样式设置动画（但是有用于动画颜色的插件），因此您可以先设置零宽度和正确的样式和颜色，然后使用 "border-width" 而不是 @ 为宽度设置动画987654322@:

例子：

$(".message_box_red").css({
  "border": "0px solid blue"
}).animate({
  "border-width":"5px",
  "margin":"1px",
  "padding":"7px",
  "width":" 409px",
  "height":"20px"
},2000,function()

【讨论】：