调整窗口大小并将页面元素保留在其中，等待调整大小结束

Question

使用jQuery的窗口调整大小功能，有没有办法创建这两个函数。

1. 在调整大小期间，它会将页面包装宽度保持在原位。因此，我们会锁定所有内容，直到调整大小和它的调整大小计时器事件结束了。

2. 一旦结束，宽度将。平滑地动画到新的窗口宽度......

灵感是http://bit.ly/kDurZ4

Answer 1

这样的事情应该让你开始。

    $(window).resize( function() {

        function smoothResize() {

            // animate the width on resize
            $('#container').animate({

                'width' : $(window).width()-15

            });

        }

        // This calls the function 'smoothResize' when the browser has finished resizing
        clearTimeout(this.id);
        this.id = setTimeout(smoothResize, 50);

    });

您需要一些if来检测屏幕大小以及div是否在约束范围内并且需要调整大小。