隐藏固定的div当页脚是在视图和显示时,页脚不是在视图?(jQuery函数)



我有一个查询,我有一个固定的div与联系方式的详细信息,我想是在显示,直到页脚在查看,然后它会淡出。当用户向上滚动时页脚不在视图中,固定的div就会淡出。我已经看了一些例子,并使用我自己的div标签和样式,什么也没有发生。我用的一个例子是:

$('#footer').appear();  
   $('#footer').on('appear', function(){
      $('#fixed_div').fadeOut();
});
$('#footer').on('disappear', function(){
   $('#fixed_div').fadeIn();
});

HTML-BASIC

<div id="footer">
   <div class="footer-wrapper">
      Footer details here
   </div>
</div>
<div id="fixed_div">
   <ul>
       <li><h1>details here</h1></li>
       <li><h1>details here</h2></li>
   </ul>  
</div>
CSS——

#call_to_action {
    bottom:0;
    position:fixed;
    padding:5px 0px 8px;
    width:100%;
    background:#000;
    z-index:3000;
}
#footer {
    position:absolute;
    width:100%;
    min-width:320px;
    color:#FFF;
    background:#000;
    overflow:hidden;
}

Footer是位于底部的主页脚,固定div位于底部:0;当用户滚动。

谁能告诉我我哪里错了?

谢谢!

您可以创建这样一个脚本:

var secondval = $('#footer').offset().top;
$(window).scroll(function(){    
   var firstval = $(document).scrollTop();
   if(firstval >= secondval)
   {
      $('#fixed_div').fadeOut();
   }
});

最新更新