一种在负载下淡入背景的方法？

Question

我正在进行一个网站设计,我需要一种方法来淡化身体标签的背景图像,当它完全加载时(可能然后暂停500毫秒).

如果你看到八月的网站设计,你会看到背景渐渐消失; 但是,这是通过Flash背景完成的.有没有办法用jQuery或JavaScript做到这一点？

---

2010年9月19日更新:

所以对于那些来自Google的人来说(这是目前"负载背景淡出"的头号结果),我只是想为每个人制作一个更清晰的实现示例.

<div id="backgroundfade"></div>在页脚中的某处添加代码(如果您不希望DOM混乱,也可以通过JavaScript附加此代码).

风格如此 -

#backgroundfade {
  position: fixed;
  background: #FFF /* whatever color your background is */
  width: 100%;
  height: 100%;
  z-index: -2;
}

然后将其添加到JavaScript脚本文件中(需要jQuery):

$(document).ready(function() {
    $('#backgroundfade').fadeOut(1000);
});

#backgroundfade在DOM完成后,这会在1秒内淡化元素(覆盖"实际背景"的框).

Answer 1

我自己没有这样做过，但它可能会起作用。

我想，你可以设置背景图像，然后用一个黑色背景的大旧 div 来掩盖它。然后使用该 div 的不透明度来创建淡入淡出效果。这个黑色的div必须覆盖整个身体。