How do I make a div appear, then slide all the way to the right, then fade out slowly?

How would I do that 开发者_运维问答in JQuery?

Give your element a position:absolute and give this a try, it might be off a few pixels (padding and borders).

var elm = $('#YourElmID');
var maxLeft = $('body').width() - elm.width();
elm.fadeIn();
elm.animate({left: maxLeft}, 2000, function(){
    elm.fadeOut();
});

"animate()" has a "complete" option. You supply a function that you want to run once the animate has completed. So, for the first animate (appear), you have a complete function that does another animate (slide-right). That animate has as its complete function another animate (fade out slowly).

In this way each one starts when the previous completes.

Regards Neil

In short:

1. jQuery Show();
2. jQuery Animate();
3. jQuery FadeOut();

Here is an quick shot which would do the trick. http://jsfiddle.net/LGBUJ/

Did you know that jQuerys chaining is really great?!