CSS轉換不調整高度

我使用'頁面轉換的集合'（http://tympanus.net/codrops/2013/05/07/a-collection-of-page-transitions/）jQuery腳本在頁面之間切換時使用事務（向下>向上，向左>向右......）。CSS轉換不調整高度

問題是，例如當第一個頁面的內容比主體大，滾動條看起來像是應該的時，下一個沒有內容的頁面將保持底部的滾動條和不必要的空白。

例，從第1頁轉到第2頁第2頁底部他們的將是一個很大的空白，從第1頁依然存在：http://netbear.be/transition/

是否有可能，每一個頁面轉換後，高度以某種方式重新計算？

// HTML-structure 
<div class="pt-wrapper"> 
    <div class="pt-page pt-page-1"> 
     // content bigger than browser height creating a scrollbar (overlay: visible;) 
     <div style="background: red; width: 150px; height: 2000px;"></div> 
    </div> 

    <div class="pt-page pt-page-2"> 
     // content smaller than browser height. 
    </div> 
</div> 

// CSS 
.pt-wrapper { 
    position: relative; 
    width: 100%; 
    height: 100%; 
    -webkit-perspective: 1200px; 
    -moz-perspective: 1200px; 
    perspective: 1200px; 
} 

.pt-page { 
    width: 100%; 
    height: 100%; 
    position: absolute; 
    top: 0; 
    left: 0; 
    visibility: hidden; 
    overflow: hidden; 
    -webkit-backface-visibility: hidden; 
    -moz-backface-visibility: hidden; 
    backface-visibility: hidden; 
    -webkit-transform: translate3d(0, 0, 0); 
    -moz-transform: translate3d(0, 0, 0); 
    transform: translate3d(0, 0, 0); 
    -webkit-transform-style: preserve-3d; 
    -moz-transform-style: preserve-3d; 
    transform-style: preserve-3d; 
}

來源

2015-06-30 Sam

您可以使用例如height屬性重要的是：身高：！100％重要; 如果這不起作用，你必須創建一個div，並使用絕對和相對固定的高度。

來源

2015-06-30 08:24:08

我認爲身高：100％已經被應用。但是因爲在頁面切換時沒有刷新，所以內容/主體的高度不會被重新計算，所以它仍然認爲當滾動條進入沒有內容的頁面時需要滾動條。 – Sam

CSS轉換不調整高度

回答

相關問題