本文主要来自: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");
});

本文介绍了一种通过在页面加载前为body元素添加类名并设置过渡效果为none的方法,来避免页面加载时的动画触发,从而提升用户体验。

2125

被折叠的 条评论
为什么被折叠?



