媒体查询与jquery无关

正如您在我的笔中所看到的，每次点击零售或批发时，我都会阻止重定向，而是会打开一个选项卡。媒体查询与jquery无关

我该如何让我的代码可以使用大于767的设备或任何我想要的大小？

此刻我的jQuery如下所示：

$(document).ready(function(){ 
    if($(window).width() > 767){ 
      $('#retail a').on("click", function(e){ 
       e.preventDefault(); 
       $('li.retail').toggleClass('display'); 
       $(this).toggleClass('angle'); 
      }); 

      $('#wholesale a').on("click", function(e){ 
       e.preventDefault(); 
       $('li.wholesale').toggleClass('display'); 
       $(this).toggleClass('angle'); 
      }); 
    } 
});

您还可以检查我的full code here

来源

2017-08-31 Wosley Alarico

你codepen工作正常 –

@AlivetoDie他们没有切换效果。他们中的任何一个都应该显示出来。 –

我的代码无论窗口宽度如何工作，所以它是错误的。原因如果在屏幕上小于767并点击零售，它不会重定向 –

$(document).ready(function(){ 
     $('#retail a').on("click", function(e){ 
      if($(window).width() > 767){ 
      $('li.retail').toggleClass('display'); 
      $(this).toggleClass('angle'); 
      } 
     }); 
     $('#wholesale a').on("click", function(e){ 
      if($(window).width() > 767){ 
      $('li.wholesale').toggleClass('display'); 
      $(this).toggleClass('angle'); 
      } 
     }); 
} });

请添加，如果点击事件中的条件。看到我的上面的代码。

来源

2017-08-31 09:44:41 Ankit

这个想法是正确的，并感谢支持。我只是重新添加了防止默认值，并删除和额外大括号。快乐编码 –

如果一个标签有＃那么它将是必要的event.preventDefault（） – Ankit

只是一个快速的....我注意到，代码只适用于当我开始调整页面大小。有没有办法在默认情况下触发调整大小？ –

尝试添加$(window).resize()功能。我曾尝试过，它的工作原理。

$(document).ready(function(){ 
    $(window).resize(function(){ 
    if($(window).width() > 767){ 
      $('#retail a').on("click", function(e){ 
       e.preventDefault(); 
       $('li.retail').toggleClass('display'); 
       $(this).toggleClass('angle'); 
      }); 

      $('#wholesale a').on("click", function(e){ 
       e.preventDefault(); 
       $('li.wholesale').toggleClass('display'); 
       $(this).toggleClass('angle'); 
      }); 
    } 
}); 
});

来源

2017-08-31 09:51:27 bellabelle

你只要写：

$(document).ready(function(){ 
    $(window).resize(function(){ 
     // your code 

    }); 
});

来源

2017-08-31 09:59:42 Samuel

它不完全工作。挑战我对未来的回答 –

为了使它成功地工作，我用了调整大小功能，并触发调整大小，以使浏览器可以检测窗口宽度，而无需启动调整大小和jQuery的看起来像这样：

$(document).ready(function(){ 
    $(window).resize(function(){ 
     if($(window).width() > 767){ 
      $('#retail a').on("click", function(e){ 
       e.preventDefault(); 
       $('li.retail').toggleClass('display'); 
       $(this).toggleClass('angle'); 
      }); 

      $('#wholesale a').on("click", function(e){ 
       e.preventDefault(); 
       $('li.wholesale').toggleClass('display'); 
       $(this).toggleClass('angle'); 
      }); 
     } 
    }).trigger('resize'); 
});

来源

2017-08-31 10:12:27

媒体查询与jquery无关

回答

相关问题