2017-10-20 120 views
0

嗨有一个错误只是显示了用户第一次滚动页面 下来,主要内容变得下移,你可以看到它在这里: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;  

    } 

我不知道什么时候我只是一个向下滚动是什么原因造成的内容下移只是第一次。先谢谢您的帮助!

回答

0

我在你的网站上看一看,当你滚动页面时,HTML div似乎被添加了,HTML div是#t3-mainbody。 #t3-mainbody的用途是什么?

Greetings,

Alexandre。

+0

我删除通过使用显示器使得T3-型主体:没有,但它仍然是内容下移,当我向下滚动,可能是什么问题? –

+0

I.m当前正在搜索答案;) –

+0

答案是:当您滚动导航栏位置开关之间固定为静态。并且包含项目的div有一个填充项,当导航栏被固定时,内容位于导航栏下方,但如果您更改为position:static,导航栏现在是一个实体元素,因此填充不会更改;)。 –

0

更改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'}); 
      }  
     }); 
});