jquery - Jquery 动画圆形 Div 的问题

Question

所以，

冒着迷失在论坛“悬停动画问题”海洋中的风险，这里是:

我正在为着陆页开发一系列悬停动画按钮。他们的悬停状态是一个圆形的 div:

初始/“mouseoff”状态是没有 div 的彩色动画文本:

我有一个 JSfiddle使用脚本来为 div 的背景颜色设置动画，以便在光标位于其上时它逐渐变为棕色，但我认为我忽略了语法中的某些内容，因为它似乎没有生效:

<script type="text/javascript">
  $(document).ready(function(){
    $(".corners").hover(function() {
      $(this).stop().animate({ backgroundColor: "#fff"}, 'fast');
    },
    function() {
      $(this).stop().animate({ backgroundColor: "#8B5E3C"}, 'fast');
    });
  });
</script>
<div class="corners"> 
    <div class="cornertext">Main Site</div> 
</div>
<div class="corners"> 
    <div class="cornertext">Mobile</div> 
</div>

一旦我弄清楚了这个属性，目标就是设置一个函数来同时更改字体颜色，但首先我必须确定 DIV 颜色动画有什么问题。 SO 人才的帮助会很棒!

-马卡报

Answer 1

您忘记包含 ui 库。我有一个工作演示 here .确保包含 the library在包含 jquery 之后。

另见 here有关扩展 .animate()

的细节