網站內容向下移動，當用戶滾動頁面

嗨有一個錯誤只是顯示了用戶第一次滾動頁面下來，主要內容變得下移，你可以看到它在這裏：https://www.mallyear.com/search?q=phone。有一些代碼涉及：網站內容向下移動，當用戶滾動頁面

<div id="#adblocker"></div> 

<header id="t3-header"> 
    // code for the header 
</header> 

<div id="stckyalias"></div> 

jQuery(function(){ 
    // Check the initial Poistion of the Sticky Header 
    var stickyHeaderTop = jQuery('#t3-header').offset().top; 

    jQuery(window).scroll(function(){ 
      if(jQuery(window).scrollTop() > stickyHeaderTop) { 
        jQuery('#t3-header').css({position: 'fixed', top: '0px'}); 
        jQuery('#stickyalias').css('display', 'block'); 
      } else { 
        jQuery('#t3-header').css({position: 'static', top: '0px'}); 
        jQuery('#stickyalias').css('display', 'none'); 
      } 
    }); 
});

和一些CSS

.t3-header { 
background: rgb(68, 136, 255) none repeat scroll 0 0; 
height: 66px; 
padding-bottom: 0 !important; 
padding-top: 8px !important; 
position: fixed; 
width: 100%; 
-webkit-box-shadow: 0 1px 0px 0px rgba(0,0,0,0.1); 
-moz-box-shadow: 0 1px 0px 0px rgba(0,0,0,0.1); 
box-shadow: 0 1px 1px 0px rgba(0,0,0,0.1); 
z-index: 999; 
transition: all 0.1s ease-in;

}

#stickyalias { 
display: none; 
height: 66px; 
}  

    #adblocker{ 
     /*transition: all 0.5s ease; */ 

    height: 80px; 
     background-color: #333333;  

    }

我不知道什麼時候我只是一個向下滾動是什麼原因造成的內容下移只是第一次。先謝謝您的幫助！

來源

2017-10-20 Claudio Martinez

我在你的網站上看一看，當你滾動頁面時，HTML div似乎被添加了，HTML div是＃t3-mainbody。＃t3-mainbody的用途是什麼？

Greetings，

Alexandre。

來源

2017-10-20 23:55:20

我刪除通過使用顯示器使得T3-型主體：沒有，但它仍然是內容下移，當我向下滾動，可能是什麼問題？ –

I.m當前正在搜索答案;） –

答案是：當您滾動導航欄位置開關之間固定爲靜態。並且包含項目的div有一個填充項，當導航欄被固定時，內容位於導航欄下方，但如果您更改爲position：static，導航欄現在是一個實體元素，因此填充不會更改;）。 –

更改jQuery代碼這樣：

jQuery(function(){ 
    // Check the initial Poistion of the Sticky Header 
    var stickyHeaderTop = jQuery('#t3-header').offset().top; 

    jQuery(window).scroll(function(){ 
      if(jQuery(window).scrollTop() > stickyHeaderTop) { 
       jQuery('#t3-header').css({position: 'fixed', top: '0px'}); 
       jQuery('#stickyalias').css('display', 'block'); 
      } else { 
       jQuery('#t3-header').css({position: 'static', top: '0px'}); 
       jQuery('#stickyalias').css('display', 'none'); 
       jQuery)('.t3-sl').css({padding-top: '0'}); 
      }  
     }); 
});

來源

2017-10-21 00:29:47

網站內容向下移動，當用戶滾動頁面

回答

相關問題