如何让div在2个高度之间出现和消失？

Question

我在这里得到了一些Javascript，这使得div出现在页面上的某个高度，但是我想让它在另一个高度再次消失，所以它显示在一系列像素之间。 E.g我想在div出现在500的高度，并在700

这里再次消失在下面的代码，我有：

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("#testdiv").hide(); 
     $(window).scroll(function(){ 
       if($(window).scrollTop()>500){ 
       $("#testdiv").fadeIn(); 
       }else{ 
       $("#testdiv").fadeOut(); 
       } 
     }); 
    }); 
</script> 

将不胜感激帮助下， 瑞安。

Answer 1

这是行不通的？我添加了额外的检查，看是否scrollTop的高于700如果是这样，隐藏#testdiv

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("#testdiv").hide(); 
     $(window).scroll(function(){ 
       if($(window).scrollTop()>500){ 
       if($(window).scrollTop()>700){ 
        $("#testdiv").fadeOut(); 
       } 
       else 
       { 
        $("#testdiv").fadeIn(); 
       } 
       } 
     }); 
    }); 
</script> 

Answer 2

我会去了解一下jQuery的航点插件在这里：

http://imakewebthings.github.com/jquery-waypoints/

它可以把你想要的结果，而无需硬编码500或700可以定义在HTML“标记”，将触发当你滚动到他们的事件。在500处设置一个标记，在700处设置另一个，你应该很好走。