div 上的 CSS 不透明度随时间延迟而不是用户交互变化

Question

我正在尝试在 div 中设置一个图像，该图像将在 5 秒内缓慢出现(不透明度从 0 到 1)。我有这个代码:

.fadeDivIn {
opacity: 1;
transition: opacity 5s ease-in;
-moz-transition: opacity 5s ease-in;
-webkit-transition: opacity 5s ease-in;
-o-transition: opacity 5s ease-in;
}

但我不知道如何自动触发它。

我一直在用 CSS3 关键帧过渡到其他元素，理想情况下，我想应用类似于不透明度的东西，但遇到了砖墙。有人可以帮忙吗？

Answer 1

http://jsfiddle.net/DerekL/9PfMF/

div{
    -webkit-animation: fadein 5s linear 1 normal forwards;
}

@-webkit-keyframes fadein{
    from { opacity: 0; }
    to { opacity: 1; }
}