Question

当我在Chrome移动设备中查看我的网站时，会在滚动时触发jQuery resize事件。据我所知，这是滚动时触发它的高度变化。我的事件只应在宽度变化时触发，而不是高度......

    $(window).resize(function() {
      if ($(window).width() < 688) {
            $('nav ul').css('display', 'none');
            $('nav p').removeClass('active');
      }

     else {
        $('nav ul').css('display', 'inherit');
     }
    });

我能找到的唯一相关答案是mobile chrome fires resize event on scroll。

提到了 onOrientationChange，但这不是我需要的，因为它不是基于设备方向，而是基于688px宽度的任何宽度。

另一个提及是：

var width = $(window).width(), height = $(window).height();

然后在你的resize事件处理程序中你可以做。

if($(window).width() != width && $(window).height() != height){
//Do something
}

这看起来像我需要的东西，但我不太了解jQuery，知道如何改变它以满足我的需要。

有什么想法吗？

Answer 1

也许可以这样做：

var saveWindowWidth = true;
    var savedWindowWidth;

//set the initial window width
    if (saveWindowWidth = true){
        savedWindowWidth = windowWidth;
        saveWindowWidth = false;
    }


//then on resize...


$(window).resize(function() {

//if the screen has resized then the window width variable will update
        windowWidth = window.innerWidth;


//if the saved window width is still equal to the current window width do nothing
        if (savedWindowWidth == windowWidth){
            return;
        }


//if saved window width not equal to the current window width do something
        if(savedWindowWidth != windowWidth) {
           // do something

            savedWindowWidth = windowWidth;
        }

    });

Chrome移动滚动触发调整大小事件

1 个答案: