javascript - jquery在页面加载时为页面背景颜色设置动画

Question

我试图在页面加载时更改网页的背景颜色。我认为这不应该起作用，“body”是我希望操纵的正确元素。我使用http://docs.jquery.com/UI/Effects/animate作为参考。

$(document).ready(function(){
    $("body").animate({ backgroundColor: "#000000" }, 1000);
});

Answer 1

工作演示 http://jsfiddle.net/aqrvA/8/

请添加 Jquery ui 库，Rest 会像火箭一样工作！<你的代码很好>

Jquery UI 链接：http: //jqueryui.com/

希望这可以帮助，:)

脚本：

  <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
  <script type="text/javascript" src="http://code.jquery.com/ui/1.8.18/jquery-ui.min.js"></script>

代码

$(document).ready(function(){
    $("html body").animate({ backgroundColor: "#000000" }, 1000);
});​

Answer 2

您不能仅使用jQuery 为颜色设置动画。您必须使用 jQuery UI，将动画扩展到颜色。看这里:)

Answer 3

“jQuery UI 效果核心扩展了 animate 函数，使其也能够为颜色设置动画。这些过渡可以为背景和边框颜色设置动画，并接受以 hex、rgb 和颜色名称指定的颜色。”

在加载之前，您将无法使用动画功能jquery-ui.js

https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.js

这就是你需要的。