Question

I am looking for an option to move a <div> on the page when the page is loaded.
The <div> contains a chat window.

The box must fall down slowly to the bottom of the page and land on the footer.
How can this be achieved?

Answer 1

Check out the .animate() function, which can be used to smoothly move div’s and other elements over the page: Animate.

Additionally, the div can be added at page load as such:

$(document).ready(function() {
    $('body').append('<div id="chatwindow">Hello World!</div>');
});