css - 网站打开时显示缓动效果

Question

如何在打开页面时显示从左侧打开的缓动效果？喜欢这个网站:http://focuslabllc.com/

Answer 1

我会使用 CSS 过渡。看看我创建的示例 http://jsfiddle.net/ZL9m7/1/

相对CSS很简单

.container {
    opacity: 0.1;
    transition: opacity 1s linear;
    -webkit-transition: opacity 1s linear; /* Play with timing functions */
    -moz-transition: opacity 1s linear;
    -o-transition: opacity 1s linear;
}

.container-ease-in {
    opacity: 1;
}

和微型 javascript 触发器(为了方便使用 jQuery):

$(function() {
    $('.container').addClass('container-ease-in');
});