Make Element Disappear After scrollTop

What could I add to the below code in order to make #top disappear after scrolling to the top?

$(document).ready(function() {
    $('#开发者_如何学运维top').hide();
        $(window).scroll(function () {
            $('#top').fadeIn(3500);
        });
        $('#top').click(function(){
            $('html, body').animate({scrollTop:0}, 'fast');
            return false;
    });
});

Add a callback to your call to 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;
    });
});

Update: Also added a variable that the scroll handler checks before showing the #top element, so that it won't show up again after it has been clicked. Here's an example: http://jsfiddle.net/eunX3/1/

Update 2: If you want to fade the element out, here's an example that demonstrates that: http://jsfiddle.net/eunX3/2/

Update 3: Here's how you make this work more than once:

$(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;
    });
});

Here's a working example: http://jsfiddle.net/eunX3/4/