2012-02-25 11 views
7

Teraz jestem ustawiania położenia okna modalne jQuery w ten sposób:Ustaw okienko do centrum jQuery

var winH = $(window).height(); 
    var winW = $(window).width(); 
    //Set the popup window to center 
    $(id).css('top', winH/2-$(id).height()/2); 
    $(id).css('left', winW/2-$(id).width()/2); 

Jak mogę wyśrodkować podręcznego kiedy przewinąć w dół?

Odpowiedz

8

Można po prostu użyć innego stylu CSS, spróbuj position: fixed

1

Zakładając, że używasz jQuery UI dialogowym the default position is 'center' który centrów IT w rzutni domyślnie. Jeśli używasz innego okna modemu jQuery, to:

$(id).css({ 
    'position': 'fixed', 
    'top': parseInt((winH/2) - ($(id).height()/2), 10) 
    'left': parseInt((winW/2) - ($(id).width()/2), 10) 
}); 

może załatwić sprawę. Nie jestem pewien, co masz na myśli mówiąc "przewiń w dół" jako modalne okno dialogowe, a przewijanie (poza oknem dialogowym) wzajemnie się wyklucza.

5

można to wykorzystać w ten sposób

// Pozycja okno modalne w środku strony

jQuery.fn.center = function() { 
    this.css("position","absolute"); 
    this.css("top", (jQuery(window).height() - this.height())/2+jQuery(window).scrollTop() + "px"); 
    this.css("left", (jQuery(window).width() - this.width())/2+jQuery(window).scrollLeft() + "px"); 
    return this; 
    } 

// następnie wywołać funkcję

jQuery(".modal-profile").center(); 

i uczyni Twój kod jest uporządkowany i łatwy w użyciu w dowolnym projekcie dla centrum modalnego. można zobaczyć tego rodzaju pracy w innym pytaniu

modal appears on page load

3

Ten jest mi pomógł!

$.fn.center = function() { 
    this.css("position", "fixed"); 
    this.css("top", ($(window).height()/2 - this.height()/2) + "px"); 
    this.css("left", ($(window).width()/2 - this.width()/2) + "px"); 
    return this; 
} 

Używaj zgodnie z opisem.

$ (". Modal-window"). Center();

Powiązane problemy