Question

我绑定到浏览器的重新大小，如下所示：

$(window).resize(function (e) { /* do stuff */ });

有没有办法，使用e来确定窗口是垂直还是水平重新调整大小，还是同时重新调整大小？如果我可以预先确定宽度和高度，我可以，但我不知道如何使用事件数据。

我想我可以保留2个变量并比较/更改它们，因为窗口已经重新调整大小 - 但我希望有一种方法可以避免这种情况并从事件中获取数据。

提前感谢您的帮助！

Answer 1

完美的建议Likwid_T！ $(window).data()是完美的。

所以你可以做without $ .event：

$(window).data("old", {width: $(window).width(), height: $(window).height()});
$(window).resize(function(e) {
    console.log($(this).data("old").width + " - " + $(this).width());
    console.log($(this).data("old").height + " - " + $(this).height());
    $(window).data("old", {width: $(this).width(), height: $(this).height()});
});

或with $ .event：

$(window).data("old", {width: $(window).width(), height: $(window).height()});
$.event.add(window, "resize", function(e) {
    e.old = {};
    e.old.width = $(window).data("old").width;
    e.old.height = $(window).data("old").height;
    $(window).data("old", {width: $(window).width(), height: $(window).height()});
    return e;
})
$(window).resize(function(e) {
    console.log(e.old.width + " - " + $(this).width());
    console.log(e.old.height + " - " + $(this).height());
});

Answer 2

您可以使用以下链接查找浏览器窗口大小：google search。

现在回答您的问题，使用上面的链接存储原始浏览器大小，并将其与更改的宽度和高度值进行比较，以查看它是垂直，水平还是两者都改变。

以下是jQuery中的一个示例：

var h = $(window).height(); // height
var w = $(window).width() // width

$(window).resize(function(e) {
    // check for change
});

调整大小的方向

2 个答案: