通过滚动缩小div的高度和宽度？

Question

在向下滚动页面时，是否可以同时缩小div的高度和宽度？例如，当用户向下滚动时，div大小从400px到400px到200px到200px，同时保持在页面的中心？我知道可以使用jQuery缩小高度或宽度，但我没有看到任何缩小两者的东西。

Answer 1

您可以获取高度和宽度，减小两者，然后在滚动事件中重新应用新值。

var divToChange = $('#sizeShifter');
$(document).scroll(function(){
    var divHeight = divToChange.height();
    var divWidth = divToChange.width();
    divHeight-=5;
    divWidth-=5;
    divToChange.css({width:divWidth, height:divHeight});
});

当用户向上滚动时，您也可以反转此效果。这是一个更复杂的参与，但这是一个有效的fiddle让你开始。