Skrollr改變身體的身高

我的網站有問題。我正在使用Skrollr在此圖像上顯示一個圖像和一個文本。文字淡出，圖像有一些很好的效果。首先我使用Foundations作爲框架，但這對我不起作用。所以我切換到Bootstrap。現在我有這個問題，我的身高設置爲2157px。我不知道爲什麼，但是在沒有Skrollr的頁面上，這不會發生。對我來說，似乎Skrollr是個問題。我用下面的代碼：Skrollr改變身體的身高

<section id="slide-1" class="homeSlide"> 
    <div class="bcg" 
     data-0="background-position: 0px 0px;" 
     data-300="background-position:0px -200px;" 
    > 
    <div class="hsContainer"> 
     <div class="hsContent container" 
      data-0="opacity:1;"  
      data-500="opacity:0;" 
     > 
      Lorem ipsum 
     </div> 
    </div> 
</div></section>

我的CSS是：

.hsContainer { 
    display: table; 
    table-layout: fixed; 
    width: 100%; 
    max-height: 50%; 
    overflow: hidden; 
    position: relative; 
    opacity: 1; 
} 

.hsContent { 
    font-size:5vw; 
    max-width: 450px; 
    margin: -150px auto 0 auto; 
    display: table-cell; 
    vertical-align: middle; 
    color: #ebebeb; 
    padding: 13% 8%; 
    text-align: center; 
    text-shadow: 0 0 5px #333; 
} 

.bcg { 
    background-position: center center; 
    background-repeat: no-repeat; 
    background-attachment: fixed; 
    background-size: cover; 
    height: 45vw; 
    width: 100%; 
}

我不明白，問題出在哪裏得來的。有人有想法嗎？

來源

2016-02-25 DummerTroll

是的，這是skrollr導致該問題作爲其視差計算的影響。 You can pass in forceHeight=false as an option在初始化skrollr，就像這樣：

var s = skrollr.init({ 
    forceHeight: false 
});

，然後它會獨自離開你的<body>高度。

來源

2016-04-22 03:20:55 simmer

Skrollr改變身體的身高

回答

相關問題