了jQuery動畫

這裏之後更新元素的CSS高度爲我工作的小提琴：http://jsfiddle.net/fFYqF/了jQuery動畫

基本上它是一個h2在-之間的一些隱藏的段落他們之上的h1。這是所有包含一個div，我想使視覺中心（水平和垂直屏幕上裏面我用的容器DIV這個CSS居中到頁面上：

div#holder { 
    position: absolute; 
    top:0; 
    bottom: 0; 
    left: 0; 
    right: 0; 
    margin: auto; 
    height:40%; 
    width:60%; 
    min-width:300px; 
}

這個工作寬度和div的高度必須指定我有2個問題......首先，我不知道div的高度，所以我曾嘗試使用jQuery動態應用它。

var h = $('#holder').height(); 
$('#main').css('height', h + 'px');

其次，我有更多的jQuery動畫文本的段落開放。這改變了持有人div的高度，從而渲染早期計算ed高度不正確，div不再垂直居中。

有沒有辦法讓持有人div始終居中在頁面上？即它應該在開放時向上移動。

請看上面的小提琴，看看我的意思。謝謝

來源

2013-02-19 harryg

我已經更新了一個branch of your fiddle使用使用.animate()與高度以及元素的頂部位置，使它看起來像它開放的混合物。

來源

2013-02-19 20:23:24 jagzviruz

結果看起來不錯，但是'top'屬性發生變化時會出現一個混亂。即，「頂」不是動畫。 – harryg 2013-02-19 20:58:15

啊，它似乎可以在Chrome中正常工作，但在Firefox中並不是這樣......頂級屬性動畫似乎被某些東西 – harryg 2013-02-19 21:10:08

你試過.animate方法嗎？我沒有像你所描述的那樣在垂直居中的情況下測試過，但是當我將其他元素引入視圖時，我已經使用這種方法來增加容器的高度。

$('#main').animate({height: '+='h }, 'slow');

來源

2013-02-19 19:42:43 theaccordance

是的，其實在我的小提琴中使用了動畫方法。這不會將CSS高度應用於父元素，但這正是我想要的。 – harryg 2013-02-19 20:04:45

你指的是哪一個元素作爲父元素？主要？還是高於主？ – theaccordance 2013-02-19 20:07:42

回答

相關問題