使元素在scrollTop後消失

Question

我可以在下面的代碼中添加什麼以使#top在滾動到頂部後消失？

$(document).ready(function() { 
    $('#top').hide(); 
     $(window).scroll(function() { 
      $('#top').fadeIn(3500); 
     }); 
     $('#top').click(function(){ 
      $('html, body').animate({scrollTop:0}, 'fast'); 
      return false; 
    }); 
}); 

Answer 1

回調到您的通話添加到animate()：

$(document).ready(function() { 
    var topClicked = false; 
    $('#top').hide(); 
     $(window).scroll(function() { 
      if (!topClicked) { 
       $('#top').fadeIn(3500); 
      } 
     }); 
     $('#top').click(function(){ 
      topClicked = true; 
      $('html, body').animate({scrollTop:0}, 'fast', function() { 
       $("#top").hide(); 
      }); 
      return false; 
    }); 
}); 

更新：還增加了一個變量，顯示#top元素，所以它不會出現之前的滾動處理程序檢查再次點擊後再次顯示。這裏有一個例子：http://jsfiddle.net/eunX3/1/

更新2：如果你想淡出元素了，這裏是一個演示一個例子：http://jsfiddle.net/eunX3/2/

更新3：這裏是你如何使這項工作不止一次：

$(document).ready(function() { 
    var topClicked = false; 
    $('#top').hide(); 
     $(window).scroll(function() { 
      if (!topClicked && $(this).scrollTop() > 0) { 
       $('#top').fadeIn(3500); 
      } 
     }); 
     $('#top').click(function(){ 
      topClicked = true; 
      $('html, body').animate({ scrollTop:0 }, 'fast', function() { 
       $("#top").hide(); 
       topClicked = false; 
      }); 
      return false; 
    }); 
}); 

這裏有一個工作示例：http://jsfiddle.net/eunX3/4/