本文介绍了一种通过在页面加载前为body元素添加类名并设置过渡效果为none的方法，来避免页面加载时的动画触发，从而提升用户体验。
本文主要来自：http://css-tricks.com/transitions-only-after-page-load/
问题：
对于页面上结构化元素，当页面加载、绘制布局的时候，动画会触发。
解决方案：
- 给body元素增加一个class
<body class="preload">
- 增加css规则
.preload *{
-webkit-transition:none !important;
-moz-transition:none !important;
-ms-transition:none !important;
-o-transition:none !important;
}
- 加载完成去掉这个东西
//无处不在的jQuery or zepto?
$("window").load(function(){
$("body").removeClass("preload");
});
扫一扫
4万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
