JavaScript与CSS — 实现动画
有了构建动态页面的基本能力,接下来实现Web应用程序中最流行、最显著的效果:动画。巧妙地使用动画可以为用户提供十分有用的反馈,可以把用户的注意力吸引到指定的元素上来。滑动
第一个动画是把一个隐藏元素(display:none)显示出来。即将指定的元素在短时间内随着高度的增加而逐步显现。使用滑动效果,提供了更为平滑的用户视觉体验。
[code lang="js"]
function slideDown( elem ) {
// 从0高度开始滑动
elem.style.height = '0px';
// 显示元素( 高度为0所以元素不可见)
show( elem );
// 找到元素完整的潜在高度
var h = fullHeight( elem );
// 在1秒内执行一个20帧的动画
for ( var i = 0; i
查看完整版本: JavaScript与CSS — 实现动画
Tags: