javascript - 身体背景图像淡入

Question

我正在尝试复制此站点背景图像中的淡入淡出。我将如何使用 jQuery 来做这件事？

Answer 1

使用图像作为背景图像。即，<img />标记。然后使用jQuery的.animate()函数：

$(document).ready(function(){
    $('img.bg').animate({
        opacity: 1;
    }, 1000);
});

CSS：

.bg {opacity: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

HTML：

<img src="bgimage.png" class="bg" />

Answer 2

工作演示 http://jsfiddle.net/9HTkV/（因为我喜欢绿巨人）：P

从淡入开始，opacity 1然后将其设为零。

这应该有帮助:)

代码

        $('.box2').animate({
            opacity: 0
        });

​

CSS在开始时您希望不透明度为 1，然后将其设为 0。

.box2 {
    height: 500px;
    width: 700px;
    background: #000000;
    opacity: 1;
}