通过滚动位置问题时仅显示DIV

Question

我已经找到了当你到达滚动位置时如何显示div.我用来做的JQuery代码是这样的:

$(window).scroll(function() {
if ($(this).scrollTop() > 75) {
    $("#ddmenubg2:hidden").fadeIn('slow');
}
else {
    $("#ddmenubg2:visible").fadeOut("slow");
}

});

据我所知,这是告诉div ddmenubg2在你到达75滚动标记之前被隐藏,然后在那个标记之外的任何地方,div保持可见......并且在那个标记之前的任何东西,div被隐藏.但是,出于某种原因,ddmenubg2 div在75像素标记之前就在我的页面上.然后当我超过75分时,div消失并重新淡入.这只发生在第一页加载或刷新时,它会在您多次向上和向下滚动后正常工作,但每当您刷新页面时,这个问题就会发生,直到您向下滚动.

现在,这个问题的一个简短修复就是让ddmenubg2 div显示"无".这实际上修复了整个滚动问题,但它使我的主菜单运行不正常.

那么我怎么做到这一点让ddmenubg2 div在你超过75之前保持隐藏并且一旦你超过75就停留...即使在第一页加载或刷新？

Answer 1

使用visibility:hidden而不是display none.这将保持元素的宽度和高度属性,但会使其不可见.以下是我修改代码以使其工作的方式.

CSS

#ddmenubg2{
   visibility:hidden;
}

javascript

$(function(){
    $(window).scroll(function() { 
        if ($(this).scrollTop() > 75) { 
            $("#ddmenubg2:hidden").css('visibility','visible');   
            $("#ddmenubg2:hidden").fadeIn('slow');  
        } 
        else {     
            $("#ddmenubg2:visible").fadeOut("slow"); 
        }  
    });
});