web-dev-qa-db-ja.com

jQueryの画面解像度の高さ調整

私が取り組んでいるページのバランスを改善するために、画面解像度に応じてDIVの上部マージンを増やす方法を見つけたいと思います。 jQueryまたはJavascriptでこれらのディメンションを設定する最良の方法は何ですか？

javascriptjqueryscreenresolutionmargins
30
Brad Birdsall

JSで画面解像度を取得するには、screenオブジェクトを使用します

screen.height;
screen.width;

その値に基づいて、自分に合ったマージンを計算できます。

72
RaYell

JQueryを使用してオブジェクトを垂直方向に中央揃えする方法の例を次に示します。

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

ただし、必要に応じて簡単に変更できます。

22
Bryan Denny

垂直方向および水平方向に中央揃えされた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 });
5
izmir_LEE

JQueryを確認してください dimensions plugin

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