Résolution de l'écran jQuery Réglage de la hauteur

Question

Afin de mieux équilibrer une page sur laquelle je travaille, je voudrais trouver un moyen d'augmenter la marge supérieure d'un DIV en fonction de la résolution de l'écran. Quelle est ma meilleure façon de définir ces dimensions avec jQuery ou Javascript?

Answer 1

Pour obtenir la résolution d'écran dans JS, utilisez screen object

 screen.height;
screen.width;
 

Sur la base de ces valeurs, vous pouvez calculer votre marge selon ce qui vous convient.

Answer 2

Voici un exemple sur la façon de centrer un objet verticalement avec jQuery:

 var div= $('#div_SomeDivYouWantToAdjust');
div.css("top", ($(window).height() - div.height())/2  + 'px');
 

Mais vous pouvez facilement changer cela en fonction de vos besoins.

Answer 3

Un autre exemple pour div verticalement et horizontalement centré ou tout objet (s):

  var obj = $("#divID");
 var halfsc = $(window).height()/2;
 var halfh = $(obj).height() / 2; 

 var halfscrn = screen.width/2;
 var halfobj =$(obj).width() / 2; 

 var goRight =  halfscrn - halfobj ;
 var goBottom = halfsc - halfh;

 $(obj).css({marginLeft: goRight }).css({marginTop: goBottom });
 

Answer 4

Découvrez le plugin jQuery dimensions

Answer 5

var space = $(window).height();
var diff = space - HEIGHT;
var margin = (diff > 0) ? (space - HEIGHT)/2 : 0;
$('#container').css({'margin-top': margin});