-1 
$(document).ready(function(){
    $("h1").hover(function(){
        $(this).animate({'color' : 'red'}, "fast");
    },
    function(){
        $(this).animate({'color' : 'white'}, "fast");
    });
});

当我将鼠标悬停在 h1 标签上时，我希望它的文本颜色变为红色。当鼠标离开 h1 标签时，我想再次将文本变为白色。有人可以修复我的代码吗？

4

2 回答 2

2

从文档 ：

注意：jQuery UI.animate()项目通过允许一些非数字样式（例如颜色）动画化来扩展该方法。该项目还包括通过 CSS 类而不是单个属性指定动画的机制。

加载 jQuery 后，在页面中包含 jQuery UI：

http://code.jquery.com/ui/1.10.3/jquery-ui.js

您的<head>遗嘱如下所示：

<!-- Load jQuery -->
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<!-- Load jQuery UI -->
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

然后动画将起作用。

JSFIDDLE

于 2013-08-16T14:08:38.873 回答
0

您不能仅使用 jQuery 为颜色设置动画。

为了使颜色动画化，您需要包含jQuery UI。

使用以下 HTML：

<h1>A header</h1>
<h1>Another header</h1>
<h1>And another header</h1>
<h2>A h2</h2>

和你的 Javascript：

$(document).ready(function(){
    $("h1").hover(function(){
        $(this).animate({color : 'red'}, "fast");
    },
    function(){
        $(this).animate({color : 'white'}, "fast");
    });
});

这是一个演示。

于 2013-08-16T14:08:35.733 回答