replicate bing image homepage effect with jquery (fade in, then fade out)

So, I want to be able to replicate the effect seen on bing.com. When you first go there, it loads an image background, and it fades in a bunch of seemingly random boxes that fade 开发者_Go百科in over the image. The boxes THEN fade back out, indicating that they are hidden, but giving you an initial indication as to their location.

I am using jquery to do the initial fadeIn, but I want to delay it for a set time, then have it fadeOut. The rest of the effects are done with css3 transitions.

Here's what I'm using right now:

<script type="text/javascript">
    $(document).ready(function () {
        $('.floatBtn').hide().fadeIn(1000);
    });

</script>

Any advice and help would be appreciated!

You can use .delay() between function calls to do exactly that. (delay it by an ammount of time.)

So use $(document).ready(function () { $('.floatBtn').hide().fadeIn(1000).delay(5000).fadeOut(1000); });