JQuery的 - 测试窗口已调整其大小超过阈值

我目前的项目需要我回顾上的窗口大小调整的一组功能，这样我可以保持敏感性质正确。然而，我使用的代码是相当抽象的，因为它调用的功能，即使窗口调整1px。

我对jQuery比较陌生，但每天都在学习越来越多，但这是我努力寻找的一种方法。

在一个理想的世界，我想调用的函数时，窗口随时被调整过一个突破点，例如：

说突破点是500像素，初始加载大小为400像素用户调整到600像素，所以超过阈值再次调用函数。它也需要逆向工作...所以窗口（或加载）大小600px，断点500px，调整大小为400px的调用函数。

下面的代码，我现在：

var windowWidth = $(window).width(); 

var resizing = !1; 
$(window).resize(function(a) { 
    !1 !== resizing && clearTimeout(resizing); 
    resizing = setTimeout(doResize, 200); 
}); 

function doResize() { 
    call_these_functions();  
}

干杯的帮助家伙

感谢您的答复Zze

我使用类似的东西到你已经什么但是我已经在我的函数开始的基础上根据窗口大小过滤了每件事情的功能。我的问题是，这些被调用太频繁，导致问题/ twitchy行为。

例如我在测试的平板电脑上出现问题，当您向下滚动时，右侧出现的滚动条似乎会触发窗口大小调整...导致函数被再次调用，自动手风琴up或.hide（）元素添加到它们的初始加载状态。

所以我的想法是，如果我可以测试它实际上破坏了一个设定的阈值，而不是窗口的大小，那么它会更可靠。

来源

2014-10-02 s.fray

请向我们解释您到目前为止所尝试的内容，以及您遇到的问题。 Stackoverflow可以帮助您解决特定问题或寻求指导。我们无法为您编写代码 – 2014-10-02 11:05:23

看起来像我已经找到了会做什么，我需要一点点工作（手指交叉，因为我目前的工作就可以了）一个解决方案，从http://xoxco.com/projects/code/breakpoints/

感谢您的帮助Zze

来源

2014-10-06 13:28:46

有一些非常方便的jQuery函数可用，它看起来像你非常接近自己解决这个问题。希望这有助于。

$(window).resize(ResizeCode); // called on window resize 
$(document).ready(function(e) { ResizeCode(); }); // called once document is ready to resize content immediatly 

function ResizeCode() 
{ 
    if ($(window).width() < 500){  
     //insertCode 
    } 
    else if($(window).width() >= 500){ 
     //insertCode 
    } 
}

更新
如果我们正在寻找“限制”这个函数的调用时间，那么你可以添加哪些每次蜱时间更新一个布尔值区间，然后在检查这个布尔前面的代码：

var ready = true; 
setInterval(function(){ready = true;}, 3000); 

function ResizeCode() 
{ 
    if (ready) 
    { 
     // run code 
     ready = false; 
    } 
}

但是我建议存储所述窗口的宽度和高度在var和然后比较用var当前窗口当窗口调整大小，这样你就可以知道窗口实际上是否调整过了'x'的数量，或者它是否是你发现的奇怪的错误。

来源

2014-10-02 11:33:12 Zze

感谢您的回复Zze，我已经添加了一些关于我的问题的更多信息。如果你能再看一次，我会非常感激。 – 2014-10-02 12:27:53

JQuery的 - 测试窗口已调整其大小超过阈值

回答

相关问题