我正在使用Dan Eden的animate.css为我的幻灯片元素制作动画。这是我在页面加载时触发动画的方式:
CSS:
body.loading .animated {
-webkit-transition: none !important;
-moz-transition: none !important;
-ms-transition: none !important;
-o-transition: none !important;
-webkit-animation-duration: 60s !important;
animation-duration: 60s !important;
-webkit-animation-delay: 60s !important;
animation-delay: 60s !important;
}
首先,我将所有动画延迟60秒。这应该足以加载任何网站。
我在页面加载时从正文中删除.loading
,以便使用默认的 .animated 延迟和1s的持续时间。
JS
jQuery(window).load(function() {
jQuery("body").removeClass("loading");
});
在我几天前更新Google Chrome之前,这就像一个魅力。它在所有其他浏览器中仍然可以正常工作。只是Chrome让我头疼。看起来60s延迟仍然被使用,尽管.loading
的等级已从身体中移除。
我想知道是否有人在页面加载时触发animate.css的工作解决方案。