一种页面效果的实现
需求：
js实现https://www.lalaberlin.com/的首页大图向上滚页时图片缩小的效果。
实现方法：
```
$(window).scroll(function () {
//$(window).scrollTop()这个方法是当前滚动条滚动的距离
//$(window).height()获取当前窗体的高度
//$(document).height()获取当前文档的高度
if ($(window).scrollTop() >= 50) {
//当底部基本距离+滚动的高度〉=文档的高度-窗体的高度时；
//我们需要去异步加载数据了
var width = parseInt($("#mainImg").width());
if(width <= parseInt($(window).width()*0.8)){
return false;
}
var timer = setInterval(function(){
width=width-15;
$("#mainImg").css('width', width +'px');
if( width < parseInt($(window).width()*0.8)){
clearInterval(timer);
}
},10);
} else
{
var width = parseInt($("#mainImg").width());
if(width > $(window).width()-15){
return false;
}
var timer2 = setInterval(function(){
width=width+15;
$("#mainImg").css('width', width +'px');
if( width > $(window).width()-15){
clearInterval(timer2);
}
},10);
}
});
```
