负荷的jQuery - 在调整大小和页面加载

我想使用一些jQuery的，但只能在小屏幕上，如移动，以及当用户改变浏览器。如果我使用resize函数，代码只能在调整大小的情况下工作，如果我自己使用代码，它只能在页面加载时工作，如何组合这两者？（我使用的CSS类，而不是检查窗口大小以我的条件，我发现它工作得更好）负荷的jQuery - 在调整大小和页面加载

$(window).resize(function(){  
    if ($(".sampleClass").css("float") == "none"){ 
     $('#nav').slideToggle(); 
    } 
});

也有小问题，当切换是在这个有条件的话，它不断地模拟并没有按”你想停下来。如果我只是放置它没有条件和调整功能，它就像一个魅力。我在这里错过了什么？

if ($(".sampleClass").css("float") == "none"){ 
     $('#nav').slideToggle(); 
    }

来源

2015-02-05 yennefer

'$（window）.on（“load resize”，function（）{// do stuff}）'？ – guest271314 2015-02-05 14:29:29

谢谢，这看似相同，节省了大量的空间:)我有与调整大小切换问题，但 - 如果我调整窗口二，三次，点击菜单键（例如.smapleclass以上），那么它停止工作完全地，如果我调整到全宽并回到小移动大小，那么它有时会再次起作用。可能是什么问题？ – yennefer 2015-02-05 16:51:16

由于guest271314在他们的意见建议，您可以在您的来电on指定事件名称的空格分隔的列表附加一个事件处理多个事件。 http://api.jquery.com/on/

就重复动画而言，您的动画实际上可能会调整文档视图的大小（因为它将内容滑入和滑出视图），这会触发另一个调整大小事件，从而触发另一个动画，等等。

如果是这样的话，无论是调整布局和动画，使得slideToggle()调用不会调整您的内容，或考虑另一种解决方案。

来源

2015-02-05 16:00:08 Palpatim

我开始只用'toggle'，而不是'slideToggle'这似乎更好地工作，但现在我意识到另一个问题： - 如果我调整窗口二，三次，每次点击菜单键（例如.smapleclass以上），以切换导航然后它完全停止工作，如果我调整到全宽并回到小移动大小，那么它有时会再次起作用。可能是什么问题？ – yennefer 2015-02-05 16:54:43

这些类型的问题通常是由于您每次调用方法的顺序略有不同，因为它们依赖于异步事件的计时。除非你明确地通过回调或承诺来设置它，否则你需要在代码中努力不要假设特定的调用顺序。 – Palpatim 2015-02-05 22:17:51

我会两次调用该函数： - 当DOM满载 - 调整大小功能

里面关于动画问题：只需调用一个新的函数resize事件结束后，如500毫秒后。

$(function(){ 

    if ($(".sampleClass").css("float") == "none"){ 
     $('#nav').slideToggle(); 
    } 

    var myVar; 
    function myNewFunction(){ 
     if ($(".sampleClass").css("float") == "none"){ 
      $('#nav').slideToggle(); 
     } 
    } 

    window.onresize = function() { 
     clearTimeout(myVar); 
     myVar = setTimeout(function() { 
      myNewFunction(); 
     }, 500); 
    }; 
});

来源

2015-02-05 16:33:37

负荷的jQuery - 在调整大小和页面加载

回答

相关问题