如何使用js指定页面加载的初始状态？

Question

我在导航栏中有一个品牌，我希望它隐藏在前 100 像素之前。但是在加载页面时，品牌是可见的。只有在页面向下滚动后，代码才有效。

考虑这个例子。

$(window).scroll(function(){
  if($(window).scrollTop()>100){
     $("#theDiv").fadeIn();
  }else{
     $("#theDiv").fadeOut();
  }
});

VIEW DEMO

当您打开 link 时，黄色方块将可见（因为不需要）。向下滚动时，正方形仍然可见（根据需要）。但是当你 return 到第一个 100px 时，正方形消失了（根据需要）。

如何使正方形在页面加载时不可见？

Answer 1

这里有一个简单的方法，不需要做太多的改动。

$(window).scroll(function(){
    fader();
});

function fader(t){
       if($(window).scrollTop()>100){
         $("#theDiv").fadeIn(t);
      }else{
         $("#theDiv").fadeOut(t);
      }   
}

$(document).ready(function() { fader(0); });

http://jsfiddle.net/GarryPas/ZtGK6/596/

如果您不想在开始时淡入淡出，请告诉我。

如何使用js指定页面加载的初始状态？

How to specify an initial state on page load using js?

html

javascript

scroll

hide