wake-up-neo.com

Höhenanpassung der jQuery-Bildschirmauflösung

Um eine Seite, an der ich arbeite, besser auszugleichen, möchte ich einen Weg finden, den oberen Rand eines DIV abhängig von der Bildschirmauflösung zu vergrößern. Wie setze ich diese Dimensionen am besten mit jQuery oder Javascript?

30
Brad Birdsall

Um die Bildschirmauflösung in JS zu erhalten, verwenden Sie das Objekt screen

screen.height;
screen.width;

Basierend auf diesen Werten können Sie Ihre Marge nach Ihren Wünschen berechnen.

72
RaYell

Hier ein Beispiel zum vertikalen Zentrieren eines Objekts mit jQuery:

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

Aber Sie könnten das leicht ändern, was auch immer Ihre Bedürfnisse sind.

22
Bryan Denny

Ein weiteres Beispiel für vertikal und horizontal zentrierte div oder beliebige Objekte:

 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 });
5
izmir_LEE

Checke das jQuery Dimensions Plugin aus

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