根据视口宽度和高度设置元素高度

Question

对不起，如果我的标题不正确。

嗯，我得到了这段代码，使我的 "section" 等于高度设备：

$(document).ready(function() {
  function setHeight() {
    windowHeight = $(window).innerHeight() -80;
    $('.top-banner').css('min-height', windowHeight);
  };
  setHeight();

  $(window).resize(function() {
    setHeight();
  });

});

一切正常，但我也在使用导航栏 Bootstrap，当是移动设备或桌面时，导航栏会更改高度。我把“-80”放在我的 js 上，它在 768< 时工作，但当是移动设备时，我需要是“-50”。所以，我想我应该用一些 "if else" 来做，但不知道怎么做。我不是老用户，所以，如果你能告诉我我需要什么代码，以及它是如何工作的，我会很高兴。

Answer 1

不确定要添加到 if/else 条件的屏幕宽度大小，因为我无法完全理解您的问题，但也许这足以帮助您：

function setHeight() {
    var vw = $(window).width();
    var vh = $(window).height();
    if (vw <= 768) {
        $('.top-banner').css('min-height', vh-50 + 'px');
    } else {
        $('.top-banner').css('min-height', vh-80 + 'px');
    }
};

根据视口宽度和高度设置元素高度

Set an elements height depending on viewport width and height

size

jquery

window