Регулировка высоты экрана с разрешением jQuery

Чтобы лучше сбалансировать страницу, над которой я работаю, я хотел бы найти способ увеличить верхний край DIV в зависимости от разрешения экрана. Каков наилучший способ установить эти размеры с помощью jQuery или Javascript?

Ответ 1

Чтобы получить разрешение экрана в JS, используйте screen object

screen.height;
screen.width;

Основываясь на этих значениях, вы можете рассчитать свою маржу к тому, что вам подходит.

Ответ 2

Вот пример того, как центрировать объект по вертикали с помощью jQuery:

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

Но вы можете легко изменить это на все ваши потребности.

Ответ 3

Другой пример для вертикального и горизонтально центрированного div или любого объекта (ов):

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

Ответ 4

Просмотрите модуль jQuery

Ответ 5

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