pionowe wyrównanie div w div za pomocą jquery?

Question

Ktoś ma jakieś doświadczenie z wtyczkami jquery vAligh lub podobnym?

Próbowałem wyrównać dla następujących, ale nie udało się. Użyłem prostej wtyczki valign (umieszczę wtyczkę na końcu, jej rozszerzenie jquery), jeśli ktokolwiek może pomóc, to byłoby naprawdę pomocne. .

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

Heres przedłużenie FN ..

(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

Możesz spróbować użyć techniki CSS, aby wyśrodkować elementy w pionie, jak pokazano here. Wierzę, że metoda jest w różnych przeglądarkach, ale niestety dodaje dodatkowy div do znaczników.

Byłoby dość łatwe do zastosowania tego css do adiustacji przy użyciu jQuery, używając $().css()