Jquery - скрыть элемент на определенной ширине браузера - PullRequest
1 голос
/ 10 февраля 2012

Я пытаюсь заставить jQuery удалить элемент, когда браузер использует определенную ширину. Я новичок в jquery. Я могу тренироваться, как определить ширину браузера, но я не могу понять, как сказать

Когда браузер достигнет ширины x, удалите неупорядоченный список с идентификатором y

У меня есть это пока

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


                });
        });

Помощь оценена

Ответы [ 4 ]

3 голосов
/ 10 февраля 2012

Будет работать следующее:

$(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, но если вы можете избежать этого, попробуйте это сделать.

0 голосов
/ 10 февраля 2012

Вы знаете, используя медиазапросы 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();
            }); 
    }); 
0 голосов
/ 10 февраля 2012

Вы можете использовать $(window).height(); и $(window).width(); для определения размера.

0 голосов
/ 10 февраля 2012

Вероятно, вы должны делать это с медиазапросами CSS.Попытка сделать это в Javascript будет ужасно медленной из-за всех событий изменения размера, которые запускаются, когда окно находится в процессе изменения размера.

...