代码之家  ›  专栏  ›  技术社区  ›  janhartmann

获取浏览器宽度并根据大小隐藏元素?

  •  3
  • janhartmann  · 技术社区  · 15 年前

    是否可以检测浏览器窗口的宽度,并在页面上隐藏低于1024的元素?

    可能在jquery中?-)

    2 回复  |  直到 11 年前
        1
  •  7
  •   jessegavin    11 年前

    您可以使用 CSS media query .

    @media (max-width: 1024px) {
      #someElement { display:none; }
    }
    

    一些旧的浏览器不支持媒体查询,因此您也可以使用jquery来完成这一任务。此示例将在窗口大小调整时显示/隐藏元素

    <div id="someElement">SOME ELEMENT</div>
    
    <script>
      $(function() {
        $(window).bind("resize", function() {
          $('#someElement').toggle($(this).width() >= 1024);    
        }).trigger("resize");
      });
    </script>
    
        2
  •  4
  •   Darin Dimitrov    15 年前
    if ($(window).width() < 1024) {
        $('#someElement').hide();
    }
    

    或:

    $('#someElement').toggle($(window).width() >= 1024);