html实现ppt的效果,js、css实现ppt的出现效果

说一种与楼上不同的动画方法吧，略有些复杂……和原生实现轮播图本质一样，以变换一个div的高度为例

window.onload = function () {

var test = document.getElementById('test');

var height1 = 600; // 希望最终的高度

var offset = height1 - parseInt(test.style.height);

stretch(offset);

function stretch(offset) {

var time = 3000; // 变换总时间

var inter = 10; // 隔10ms变换一次

var speed = offset/(time/inter); // 每次边换移动的距离

var h = parseInt(test.style.height) + offset;

var go = function () {

var height = parseInt(test.style.height);

if ((speed >0 && height < h) || (speed < 0 && height >h)) {

test.style.height = height + speed + 'px';

setTimeout(go, inter);

}

else {

test.style.height = h + 'px';

}

};

go();

};

}