jquery - jqueryを使用して要素をウィンドウに配置する

Question

var wdt = document.body.offsetWidth/2.6

var hgt = document.body.offsetHeight/4

$("#element").offset({left:wdt, top:hgt})

私がやろうとしているのは、画像(#要素)を本体に対して相対的に配置することです..つまり、ウィンドウに対して中央に配置します....さまざまなブラウザ/ウィンドウサイズ/画面に対して....画面に関係なく.

これは有効ですか..それとも他にありますか..?

score 1 · Accepted Answer

$("#element").css({left:50%, top:50%});

また

$("#element").css({left:window.innerWidth/2.6, top:window.innerHeight/4});

やるべきです。または、さらに良いことに、CSS ファイルで次のようにします。

#element {
    left:50%;
    top:50%;
}

これにより、左上隅に基づいて要素が配置されるため、正確な中央に表示されないことに注意してください。これを説明するには、次のようにします (上記の CSS を保持します)。

$("#element").offset({
    left:-$(this).css("width")/2,
    top:-$(this).css("height")/2
});

score 0 · Accepted Answer

jQuery の使用

$("img").css({
  top: ($(window).height()-$("img").height())/2,
  margin: '0 auto'
});

2 に答える 2