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转换不调整高度

回答

相关问题