javascript - 根据窗口高度添加 CSS

Question

只要查看器使用大屏幕（超过 750 像素高），我就有一个看起来很棒的弹出窗口。我想添加一个 CSS 选择器来为在笔记本电脑上查看的人推送重要内容（并隐藏标题和可消耗的介绍信息）。我认为最简单的方法是将body标签提高-180 px。

我认为这对于我第一次接触 jQuery 来说是件好事，但我似乎无法让它发挥作用。我试过了：

if($(window).height() <= 650)
   $(body).css("margin-top","-180px");

并且

$(document).ready(function() {
    if ($(window).height() < 670) {
        $("body").css('margin-top', '-180px');
    }
    else {
        $("body").css('margin-top', '0px');
    }
});​

但似乎都不起作用。如何根据当前窗口高度更改主体样式？

Answer 1

只需使用媒体查询来提供不同的版本或样式：

@media only screen 
and (max-height: 650px) {
    /* Styles */
}