将 if 语句添加到 jQuery 导航响应响应式站点

Question

基本上，我希望导航在用户登陆桌面页面时保持打开状态。如果用户在移动设备上，我希望导航开始隐藏。我正在使用一个非常基本的切换 jquery 来实现此功能，我希望只需要一个条件语句。

作为一个脚本新手，我仍然很难掌握 if 语句的工作原理。

桌面：

  $(document).ready(function() {
  $('#nav').show();

  $('#mnu-toggle').click(function() {
  $('#nav').toggle(400);
  return false;
  });

手机：

  $(document).ready(function() {
  $('#nav').hide();

  $('#mnu-toggle').click(function() {
  $('#nav').toggle(400);
  return false;
  });

我在网站上只有两个媒体查询 768 像素和 320 像素我希望关闭的移动导航发生在 768 像素中断内。

任何有助于理解 if 语句的概念并提供解决方案都会非常有帮助。

Answer 1

你可以简单地做这样的事情：

$(document).ready(function() {
  if($(window).width()>768){
      $('#nav').show();
  }
  else{
      $('#nav').hide();
  }
  $('#mnu-toggle').click(function() {
  $('#nav').toggle(400);
  return false;
  });