需求：

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);

        }

    });

```