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

Question

向下滚动页面时是否可以同时缩小 div 的高度和宽度？例如，当用户向下滚动时，div 大小从 400 像素 x 400 像素变为 200 像素 x 200 像素，同时保持在页面的中心？我知道可以使用 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});
});

您还可以在用户向上滚动时反转此效果。这涉及更多一点，但这里有一个可以帮助您入门的工作小提琴。