CSS-Tricks Example

Loading Dots jQuery Plugin (download)

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.

What it does

Call it on an element and it replaces the content of that element with the text "Loading" and then dots. The dots start at zero and add themselves (up to your specified limit) and then start over. It's just a simple design pattern to let a user know something is happening.

It could be used right before an AJAX call, for example.

Using it

$("#randomArea").Loadingdotdotdot({
    "speed": 400,
    "maxDots": 4,
    "word": "Loading"
});

Cleaning up

Calling the plugin starts an interval. To clean that up (like after your successful AJAX call or whatever), call it again like this:

$("#randomArea").Loadingdotdotdot("Stop");