可以为Jquery .CSS背景变化设置动画吗？

Question

I am attaching background images to the body element using this: 我正在使用此背景图像附加到body元素：

<script>
$(document).ready(function(){

    $("body").css( "background" , "url(someimage.jpg)");

});
</script>

This is nice, but the background images are really large and I would like to fade them in using fadein() or something once they have loaded all the way. 很好，但是背景图像确实很大，一旦它们全部加载完毕，我想使用fadein（）或其他方法使其褪色。 However, I can't seem to find a way to do this with jQuery or javascript. 但是，我似乎找不到使用jQuery或javascript做到这一点的方法。 Is there one? 有一个吗？ Any clever suggestions? 有什么聪明的建议吗？ I can import the jquery-ui library if that would help. 我可以导入jquery-ui库，如果有帮助的话。

So to be clear, what I need to happen goes something like this: 所以要明确一点，我需要做的事情是这样的：

Page loads -> Image finishes loading -> Image fades into being the background image for the body element 页面加载->图像加载完成->图像淡出为body元素的背景图像

Answer 1

Ok, I figured it out, but this was a duplicate as @am not i am suggested ( duplicate question ). 好的，我知道了，但这是重复的，因为我不建议@am（重复的问题）。

Working fiddle with my solution: http://jsfiddle.net/kRjrn/8/ 摆弄我的解决方案： http : //jsfiddle.net/kRjrn/8/

HTML 的HTML

<body>
    <div id="background">.
    </div>
    <p>hello world</p>
    <p>hello world</p>
    <p>hello world</p>
    <p>hello world</p>    
</body>

javascript javascript

$(document).ready(function(){
    $('#background').animate({ opacity: 1 }, 3000);
});

CSS 的CSS

#background {
    background-image: url("http://media.noupe.com//uploads/2009/10/wallpaper-pattern.jpg");
    opacity: 0;
    margin: 0;
    padding: 0;
    z-index: -1;
    position: absolute;
    width: 100%;
    height: 100%;
}

Answer 2

Believe it or not, jQuery doesn't support fading background colors! 信不信由你，jQuery不支持褪色的背景色！ But don't worry... there's a plugin for that! 但是不用担心...有一个插件！

The "original" background-fading plugin is this one: “原始的”背景渐变插件是这个：

https://github.com/jquery/jquery-color https://github.com/jquery/jquery-color

I just found this one too: 我也刚刚找到了这个：

http://www.bitstorm.org/jquery/color-animation/ http://www.bitstorm.org/jquery/color-animation/

可以为Jquery .CSS背景变化设置动画吗？

问题描述

2 个解决方案

解决方案1
0 已采纳 2012-06-15 14:27:48

解决方案2
-1 2012-06-15 12:44:22

可以为Jquery .CSS背景变化设置动画吗？

问题描述

2 个解决方案

解决方案1 0 已采纳 2012-06-15 14:27:48

解决方案2 -1 2012-06-15 12:44:22

解决方案1
0 已采纳 2012-06-15 14:27:48

解决方案2
-1 2012-06-15 12:44:22