Obtenir la largeur du navigateur et cacher l'élément en fonction de la taille?

Question

Est-il possible de détecter quelle est la largeur d'une fenêtre de navigateur et de masquer un élément de la page s'il est inférieur à 1024?

Dans JQuery peut-être? :-)

Answer 1

Vous pouvez accomplir cela en utilisant un CSS media query.

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

Certains navigateurs plus anciens ne prennent pas en charge les requêtes média, vous pouvez donc également utiliser jQuery. Cet exemple montrera/cachera l'élément quand la fenêtre se redimensionnera

<div id="someElement">SOME ELEMENT</div> 

<script> 
    $(function() { 
    $(window).bind("resize", function() { 
     $('#someElement').toggle($(this).width() >= 1024);  
    }).trigger("resize"); 
    }); 
</script> 

Answer 2

if ($(window).width() < 1024) { 
    $('#someElement').hide(); 
} 

ou:

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