javascript $(window).resize() in safari:如果滚动窗口(但不调整大小),为什么它也能工作?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/29940691/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
$(window).resize() in safari : why it works also if scroll window (but doesn't resize)?
提问by Mapsism Borja
i noticed, with safari on my iphone5 that
我注意到,在我的 iphone5 上使用 safari
$(window).resize()
it works strangely...
它的工作很奇怪......
i have this code:
我有这个代码:
$(document).ready(function () {
$(window).resize(function() {
avviaChart();
initialize();
if($('#time').is(':checked')){
$("#time").removeAttr('checked');
$("#Time").css('border','2px solid #ffffff');
}
});
});
this code should work only when sizes of window change.... with other browser work very good, but with safari the code works also if i scroll the page (and the sizes of window doesn't change)...
这段代码应该只在窗口大小改变时才起作用......与其他浏览器一起工作非常好,但是如果我滚动页面(并且窗口大小不改变),safari代码也可以工作......
HOW IS POSSIBLE ? O.o
怎么可能?哦
回答by Rizky Fakkel
This is a known bug that happened from iOS6 Safari. The resize event fires randomly while scrolling. Fortunately it's not a jQuery issue.
这是 iOS6 Safari 中发生的已知错误。resize 事件在滚动时随机触发。幸运的是,这不是 jQuery 问题。
This answerto a similar problem might solve your issue as well.
For the lazy:
对于懒人:
3Stripeposted that you should "Store the window width and check that it has actually changed before proceeding with your $(window).resize function"
3Stripe发帖说你应该“存储窗口宽度并在继续你的 $(window).resize 函数之前检查它是否真的改变了”
His code snippet:
他的代码片段:
jQuery(document).ready(function($) {
/* Store the window width */
var windowWidth = $(window).width();
/* Resize Event */
$(window).resize(function(){
// Check if the window width has actually changed and it's not just iOS triggering a resize event on scroll
if ($(window).width() != windowWidth) {
// Update the window width for next time
windowWidth = $(window).width();
// Do stuff here
}
// Otherwise do nothing
});
});
回答by Mohammad Rezaei
As you see, in iphone/ipad and android devices, when you scroll down the page, address bar will be small and when scroll to top address bar size will be return to the actual size, this operation fires window.resize event
如您所见,在 iphone/ipad 和 android 设备中,当您向下滚动页面时,地址栏会变小,当滚动到顶部地址栏大小将返回实际大小时,此操作会触发 window.resize 事件
回答by Bhagwati Malav
This issue specific to ios, if any handler which changes size of anything in window, will trigger resize event, and sometimes it will get stuck in infinite resize call
. So as mentioned above, have one condition which compares previous width
with current width
if both are equal then return.
这个特定于 ios 的问题,如果任何处理程序更改窗口中任何内容的大小,将触发 resize 事件,有时它会卡在infinite resize call
. 因此,如上所述,有一个条件previous width
与current width
如果两者相等则返回进行比较。