边框动画在悬停时不起作用。 SlideToggle 工作正常

Question

我希望在另一个 DIV 上悬停时转换右边框颜色。让 slideToggle 工作的解决方案与我阅读的内容略有不同，所以我想这个解决方案会略有不同。

这是非常简单的代码：

$(document).ready(function(){

$(".articleExpand").hide();

$('.mainArticle').hover(function() {   
     $(this).find('.articleExpand').stop(true,true).slideToggle('medium');
  }); 


$("mainArticle").hover(function(){
  $(this).find('.articleExpand').animate({"borderRightColor" : "#cccccc"}, 300);
});


});

正如我提到的，slideToggle 很好，但我不确定如何集成动画。

非常感谢大家，

汤姆

Answer 1

欢迎来到 JQuery UI 的精彩世界！ （这就是你需要使用的。）

http://jqueryui.com/demos/animate/

“jQuery UI 效果核心扩展了 animate 函数，使其也能够为颜色设置动画。它被类转换功能大量使用，它能够为以下属性设置颜色动画：

背景颜色 边框底部颜色 边框左颜色 右边框颜色 边框顶部颜色 颜色 轮廓颜色 具有以下组合之一：

十六进制 (#FF0000) rgb (rgb(255,255,255)) 名字（“黑色”）”