jQuery .resize() 到特定大小

Question

是否可以使用 .resize(); 触发某些内容，但仅在调整到特定宽度或高度时才触发？或者只有当尺寸增加时？

Answer 1

如果您向 resize 添加处理程序，您将能够使用 $(this).height() 和 $( 从处理程序内部检查元素的大小this).width()。这样，如果数字不满足某些特征，您可以返回而不需要执行任何操作。

通过记住“最后”值并将它们与处理程序中的当前值进行比较，应该可以检测维度增加，例如：

$("#id").resize(function() {
var height = $(this).height();
var 宽度 = $(this).width();

var heightIncreased = height > lastHeight;
var widthIncreased = width > lastWidth;
var heightDecreased = height < lastHeight;
var widthDecreased = width < lastWidth;

if(heightIncreased || widthIncreased) {
    // whatever
}

lastHeight = height;
lastWidth = width;

});

但是，请注意： 无法保证在调整元素大小的过程中您的调整大小处理程序将被调用多少次（即您可能会连续触发或仅在最后触发一次），如下所示这取决于浏览器。