javascript - 延迟标志淡入网站？

Question

只是想知道在用户进入页面约 5 秒后让左上角的徽标淡入的最佳方法是什么？

这是http://jsfiddle.net/elroyz/sjD8X/角落里的标志

body {
background-color:#000;}

我只放这个是因为它不会让我在没有代码的情况下发布

我读了一些关于 jquery 延迟的东西，但我对此几乎一无所知，所以认为可能还有另一种选择

提前致谢

Answer 1

$('img').delay(5000).fadeOut(250);

这将在 5 秒后淡出 img。代码中的时间以毫秒为单位。

有关此的更多信息，请参阅

• api.jquery.com/delay/
• api.jquery.com/fadeout/
• api.jquery.com/fadein/

Answer 2

尝试使用这种转换。

http://www.problogdesign.com/coding/get-started-with-css3-transitions-today/

祝你好运！

Answer 3

HTML

<img onload="this.style.opacity='1';" src="image path" />

CSS

img {opacity:0;-moz-transition: opacity 2s;-webkit-transition: opacity 2s;-o-transition: opacity 2s;transition: opacity 2s;}

Answer 4

CSS 3 动画。（使用供应商前缀，因为它仍然是新的和实验性的）：

@-webkit-keyframes fadein {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@-moz-keyframes fadein {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@-o-keyframes fadein {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes fadein {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}

#logo {
  -webkit-animation: fadein 5s infinite;
  -moz-animation:    fadein 5s infinite;
  -o-animation:      fadein 5s infinite;
  animation:         fadein 5s infinite;
}