Android浏览器在滚动时触发jQuery $(window).resize()

Question

我最近遇到了一些非常奇怪的事情,我不确定是不是我可能只是遗漏了一些东西,但我无法理解为什么会这样.

我有一个网站上运行了以下jQuery代码段:

$(window).resize(function(){
  alert("Resize fired!");
});

当我在Android手机浏览器上访问该网站时,只需在网站上下滚动,我就可以看到警报.

Android浏览器滚动条(淡入和淡出)覆盖在整个站点的顶部,似乎不会导致窗口的任何大小调整,所以我猜这个事件不会被它们触发.

有谁知道为什么Android浏览器会在滚动时触发此事件？

任何信息将不胜感激.

编辑:

我已经尝试为body设置CSS,设置overflow-y滚动查看这是否是一个可行的解决方案,但事件仍然在Android上滚动时被触发.

编辑#2:

我在HTML中使用以下metatag:

<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">

Answer 1

我遇到了同样的问题,我的解决方案是检查窗口大小是否实际发生了变化,为此我需要将过去的窗口宽度存储在我的应用程序中.代码可能是这样的:

$(window).resize(function() {
  clearTimeout(app.resize.timer)
  app.resize.timer = setTimeout(function(){
     var window_changed = $(window).width() != app.size.window_width
     if(window_changed) console.log('Window size changed! resize site')
  }, 500)               
})

我没有指望窗口高度因为我的Android浏览器隐藏并在我向下滚动网站时显示地址文本框,使窗口高度在垂直滚动上更改