中心內部的div並使用jQuery

我已經制定了一個網頁，如下所示窗口的底部之間的格...中心內部的div並使用jQuery

|----------------------| 
|  |----------|  | 
|  | Logo div |  | 
|  |----------|  | 
|      | 
|  |----------|  | 
|  |   |  |  
|  | Content |  | 
|  |   |  | 
|  |----------|  | 
|----------------------|

目前我正在嘗試我div（Content）使用居中以下功能：

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

}

這是我從另一個SO問題得到：Using jQuery to center a DIV on the screen

如果我的分辨率足夠大，此功能可以正常工作，但是在較小的屏幕上，它會導致div我正在以「上來」爲中心並與包含上面的徽標的div共享空間。所以我想用jQuery實現的是將其垂直居中在徽標div#logo和頁面的「結尾」之間，而不是浮動在標誌div的頂部。

我該如何使用jQuery來做到這一點？

來源

2012-02-26 Aidanc

由於它絕對定位，你不能真正引用它與另一個div有關。

你需要做的是檢查高度/寬度的計算結果，如果它們超出了最低要求，則用一個固定值替換它們。您可以硬編碼固定值或使用JQuery來獲取徽標div的高度。

var h = 100; //Height of logo div 
var top_position = (($(window).height() - this.outerHeight())/2) + $(window).scrollTop(); 

if(top_position < h) 
    top_position = h; 

this.css("top", top_position + "px");

：沿線的

東西

來源

2012-02-26 22:38:44 MattP

中心內部的div並使用jQuery

回答

相關問題