当窗口时执行函数.宽度会被调整，但高度不会

Perform function when window.width is resized but not the height

本文关键字：调整 高度 窗口 执行 函数      更新时间：2023-09-26

我正在开发一个响应式网站，我有一些标签从标签到手风琴在小屏幕上的变化。下面是我目前的做法:

var myGlobalVariable = {};
$(window).resize(function(e) {
    duringResize();
    myGlobalVariable.windowWidth = window.innerWidth;
});
function widthHasChanged() {
    return window.innerWidth !== myGlobalVariable.windowWidth;
}
function duringResize() {
    if(widthHasChanged()) {
        if(Modernizr.mq('all and (min-width:1000px)')) {
            /* Do stuff for tabs */
        } else {
            /* Do stuff for accordion */
        }
    }
}

我对此并不满意，因为我必须使用全局变量来存储浏览器窗口的最后宽度，以便检查宽度是否发生了变化。

我必须这样做的原因是因为在手机上，当选项卡处于折叠模式时，点击一个选项卡实际上会使文档更高，以容纳选项卡内容。出于某种原因，这被归类为调整大小，即使"窗口"在移动设备上仍然是相同的大小。这意味着即使宽度没有改变，我的标签/手风琴代码也会被调用，这会把事情搞砸。

是我错过了什么，还是这是实现这一目标的唯一途径?欢迎使用jQuery和javascript解决方案

没有特定的事件绑定到窗口宽度更改。我看你的解决方案不错。

我能想到的唯一其他方法是对$(window)进行常规检查。计时器内部的宽度。我认为总的来说，单个全局变量更可取:)

相关文章：