jquery之滚动效果淡入淡出

我添加了在这里找到的脚本。它是一种享受。然而，当我尝试对其应用淡入淡出效果时，我陷入了困境。此刻它就被切断了。

script type="text/javascript"> 
 
 
    $(document).ready(function() { 
 
 
        $(window).scroll(function () { 
              var height = $('body').height(); 
              var scrollTop = $('body').scrollTop(); 
              var opacity = 1; 
 
 
              if(scrollTop > 400) { 
                  opacity = 0; 
              } 
 
           $('.social').css('opacity', opacity); 
        }); 
    }); 
</script> 

编辑:我把它绑起来并且它有效。非常感谢大家:

<script type="text/javascript">  
$(window).scroll(function() {  
// The social div  
var $socialDiv = $('.social');  
 
//Get scroll position of window  
var windowScroll = $(this).scrollTop();  
 
//Slow scroll of social div and fade it out  
$socialDiv.css({  
'margin-top' : - (windowScroll / 3) + "px",  
'opacity' : 1 - (windowScroll / 550)  
});  
});  
</script>​ 

请您参考如下方法:

您应该使用.animate()或.fadeTo()为了达到这个效果。

使用 .css('opacity', opacity); 将使您的元素突然消失。