css - 使 Css3 过渡适用于页面加载

Question

可能重复：
加载时的css3过渡动画？

我想将页面加载的进度条从 0% 变为 60%。请在下面找到我的小提琴。我尝试使用 css 转换属性，但无法实现。

我已经使用 Jquery 实现了它。请在下面找到小提琴。 http://jsfiddle.net/meetravi/5zJPr/3/

我想知道是否可以仅使用 CSS3 解决方案？如果不是 CSS3 动画在页面加载时是不可能的？有人可以清楚地解释为什么 CSS 强制等待页面中的事件说悬停或单击以使动画发生而不是使其在页面加载时起作用吗？

谢谢

score 5 · Accepted Answer

您可以使用 CSS3 动画来做到这一点，但要小心——它们没有得到广泛的支持。这是一个更新的 jsFiddle。

animation: width <duration> <easing>;

@keyframes width {
    from { width: 0%; }
    to   { width: 60%; }
}

score 0 · Accepted Answer

0

没有 JavaScript 或 jQuery，这是不可能的。

于 2012-07-09T15:07:31.207 回答

2 回答 2