jqueryを使用してdiv内のdivを垂直に整列しますか？

Question

誰でもjquery vAlighプラグインなどの経験がありますか？

私は次のように整列しようとしましたが、失敗します。誰かが本当に役に立ちそうなら、私は単純なvalignプラグインを使用していました（私は最後にプラグインを入れます、そのjquery拡張子）。 。相続人FN拡張

var overlayLayer = $("<div id='office-location'></div>").addClass('modal-overlay'); 
$('body').append(overlayLayer); 

$('<div id="content-for-overlay" style="background-color: white;"></div>').appendTo(overlayLayer); 

this.render({ to: "content-for-overlay", partial: "office-location-modal" }); // this just copies html into the layer 

$('#content-for-overlay').vAlign(); THIS USES a plugin called valign but it doesn't align 

$("body").css("overflow", "hidden"); 
$('#office-location').css("opacity", 0.8).fadeIn(150); 
$('#content-for-overlay').css("opacity", 1); 

..

(function($) { 
$.fn.vAlign = function() { 
    return this.each(function(i) { 
     var h = $(this).height(); 
     var oh = $(this).outerHeight(); 
     var mt = (h + (oh - h))/2; 
     $(this).css("margin-top", "-" + mt + "px"); 
     $(this).css("top", "50%"); 
     $(this).css("position", "absolute"); 
    }); 
}; 

}）（jQueryの）。

Answer 1

hereのように、CSS技術を使用してアイテムを垂直方向にセンタリングすることができます。 私はこのメソッドがブラウザ間であると思いますが、残念ながらマークアップに余分なdivが追加されます。

$().css()