使用动态滤镜来实现淡入效果

虽然不是个新话题,但还是有一定的实用性.
有时候我们的页面会需要有一些淡入的效果，比如说图片，还有菜单。
我们可以用动态滤镜加一个小函数来实现。
1。定义要淡入的对象的CSS，关键是要把它设成不可见。
.Div{
visibility:hidden;
filter : progid:DXImageTransform.Microsoft.GradientWipe ( duration=0.5,gradientSize=0.75,motion=forward ) ;
}

2。js函数
function fadeIn(oDiv){
oDiv.filters[0].Apply();
oDiv.style.visibility="visible";
oDiv.filters[0].play(0.4);
}
这个函数你可以在页面onload事件触发或者用其他动作调用。
通过更换CSS中的滤镜，我们就可以轻而易举的达到各种显示效果。相比用setTimeout来设置透明度要容易，且效果会丰富很多。