1 
<!-- include Google's AJAX API loader -->
<script src="http://www.google.com/jsapi"></script>
<!-- load JQuery and UI from Google (need to use UI to animate colors) -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js"></script>

<script type="text/javascript">
$(document).ready(function() {
$("#menuknop1").hover(function() {
    $(this).animate({"color":"black"}, "slow");
}, function() {
    $(this).animate({"color":"white"}, "slow");
});

});
</script>

<div id="menuknop1"><i>Home</i></div>

我正在尝试为这段代码设置动画，以便文本在悬停时变为黑色，在离开该区域时变为白色。为什么这不起作用？

4

1 回答 1

2

首先加载 jQuery——jQuery-UI 是一个插件，不包含 jQuery 本身：

<!-- load JQuery and UI from Google (need to use UI to animate colors) -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>

除此之外，您的代码在这里工作得很好：http: //jsfiddle.net/mblase75/pMeJc/——前提是您使用 jQuery 1.7.2。

jsFiddle 不允许我选择 jQuery UI 1.8.18 和 jQuery 1.8.0，所以显然它与那个版本不兼容。根据 jQuery-UI 网站，“ 1.8.23 修复了 jQuery 1.8.0 的所有已知问题。”

于 2012-08-29T18:55:17.477 回答