jQuery的 - 在特定的浏览器宽度隐藏元素

我试图让jQuery删除一个元素，当浏览器eaches一个特定的宽度。我对jquery很陌生。我可以锻炼如何检测浏览器的宽度，但我不能工作，如何说jQuery的 - 在特定的浏览器宽度隐藏元素

当浏览器到达x宽去除无序列表IDŸ

我有这个迄今为止

jQuery(function ($) { 
       $(window).resize(function(){ 


       }); 
     });

帮助表示赞赏

来源

2012-02-10 adam

您应该可以使用CSS媒体查询来做到这一点。尝试在Javascript中执行此操作将会非常滞后，因为窗口正在调整大小的过程中会触发所有调整大小事件。

来源

2012-02-10 15:09:50 dty

下面的工作：

$(window).resize(function(){ 
    var width = $(this).width(); // The window width 
    if (width < someSize) { 
    $('#y').hide(); // Or to completely remove it form the DOM use `remove()` 
    } 
});

然而，造型一般为CSS的关注最好留给，如果你能避免使用此方法，请尝试这样做。

来源

2012-02-10 15:10:36

只是为了补充答案。 [工作演示]（http://jsbin.com/isosuz/edit#javascript,html）。 – Oybek 2012-02-10 15:11:30

您可以使用$(window).height();和$(window).width();来确定大小。

来源

2012-02-10 15:11:36

你知道通过使用CSS媒体查询，你可以做到这一点没有jQuery？

查阅这些资源：

http://www.w3.org/TR/css3-mediaqueries/

http://mislav.uniqpath.com/2010/04/targeted-css/

http://protofunc.com/scripts/jquery/mediaqueries/

它仍然可以在jQuery的使用进行：

jQuery(function ($) { 
      $(window).resize(function(){ 
       var _width = $(this).width(); 
       if(_width > 900 && $('#myElement').is(':visible')) 
         $('#myElement').hide(); 
       else if (_width <= 900 && !$('#myElement').is(':visible')) 
         $('#myElement').show(); 
      }); 
    });

也可以做为：

jQuery(function ($) { 
      $(window).resize(function(){ 
       var _width = $(this).width(); 
       if(_width > 900) 
         $('#myElement:visible').hide(); 
       else if (_width <= 900) 
         $('#myElement:hidden').show(); 
      }); 
    });

来源

2012-02-10 15:13:25

谢谢你的帮助。我知道我可以通过媒体查询来做到这一点，但我正在尝试做一些比平常更复杂的事情，并尝试学习更多关于jQuery的知识。谢谢，会尝试一些这些解决方案。 – adam 2012-02-10 15:15:47

jQuery的 - 在特定的浏览器宽度隐藏元素

回答

相关问题