Android浏览器触发jQuery的$(窗口).resize()上scolling浏览器、窗口、Android、jQuery

2023-09-05 02:04:21 作者:執念

我最近碰到的东西很奇怪,我不知道这是否是也许我只是失去了一些东西,但我不明白为什么会这样。

我有一个具有以下jQuery的片断上运行一个网站:

  $(窗口).resize(函数(){
  警报(调整大小解雇了!);
});
 

当我去在Android手机上的浏览器的网站,并简单地上下滚动的网站,我可以看到的警报。

Android的浏览器滚动条(其中淡入淡出)被覆盖ontop整个网站,并似乎没有引起窗口的任何调整大小,所以我猜这个事件不被解雇他们。

有谁知道为什么Android浏览器上滚动激发此事件?

所有信息将大大AP preciated。

编辑:

我已经尝试设置的CSS的身体,将溢出-Y滚动,看看这是否是一个可行的解决方案,但该事件还是被解雇的滚动在Android上。

编辑#2:

我用我的HTML下列元标记:

 < META NAME =视口内容=WIDTH =装置宽度,初始规模= 1,最低规模= 1>
 

解决方案

我有同样的问题,我的解决办法是检查窗口大小实际改变,做它,我需要在一些地方保存过去的窗口宽度在我应用程序。在code可能是这样的:

  $(窗口).resize(函数(){
  clearTimeout(app.resize.timer)
  app.resize.timer = setTimeout的(功能(){
     变种window_changed = $(窗口).WIDTH()!= app.size.window_width
     如果(window_changed)的console.log('窗口大小改变了!调整网站)
  },500)
})
 
Android 打开浏览器

我不是窗口的高度计,因为我的Andr​​oid浏览器隐藏和显示地址文本框,当我向下滚动的网站上做垂直滚动窗口的高度变化

I have recently come across something quite wierd, I'm not sure if it's maybe me just missing something but I can't understand why this is happening.

I have a site that has the following jQuery snippet running on it:

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

When I go to the site on an Android phone browser, and simply scroll up and down the site, I can see the alert.

The Android browsers scroll bars (which fade in and out) are overlayed ontop of the entire site and don't seem to cause any resizing of the window, so I'm guessing this event isn't being fired by them.

Does anyone know why the Android browser is firing this event on scrolling?

Any information will be greatly appreciated.

EDIT:

I have tried setting CSS for body, setting overflow-y to scroll to see if that was a viable solution but the event is still being fired on scrolling on Android.

EDIT #2:

I am using the following metatag in my HTML:

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

解决方案

I was having the same problem, my solution was to check if the window size actually changed, for doing it I needed to store the past window width somewhere in my app. The code could be something like this:

$(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)               
})

I did not count on the window height because my Android browser hides and shows the address textbox when I scroll down the site making the window height change on vertical scroll