jQuery Ajax Loader & Spinner

The title is fairly generic, so if you have found this, congratulations, your life is about to become far simpler. When working on or with ajax enabled web sites we usually run into the issue of request times, users need to be shown that something is happening in the background and visually we accomplish this with an Ajax Loader. You would have seen plenty of these by now, little animated gifs that give you a sense the web-page is loading something.

Now the drama here is they are a PITA to create all the time on the fly while your writing those fancy ajax queries, some of the framework simplify the task by letting you specify a loading attribute, but the behaviour isn’t standard and I find the implementation is lacking because it is usually an after thought of the original Ajax request in the framework. Also you don’t want to create useless mark-up in you page by having a permanent but hidden until needed ajax overlay like I see a lot of sites doing. Less code = better at everything, remember that.

So here is the solution, create on the fly ajax loaders when and where-ever you may need them!

Demo

View Demo :: jQuery

Keep Reading...

Ajax Pagination & Back Button

Ok so hands up if your a fan of Ajax, you can’t see it but I certainly have my hands up as do many of the other developers out there, so what is this post about? Well if you have ever built an Ajax application or website you would know that Ajax breaks the browsers natural navigation, things like the ‘back button’, ‘forward button’, history, favouriting a page or browsing to it via the URL input all become useless because there is no physical URL for those elements to use or save.

Now yes there are some solutions out there for providing Ajaxified links that keep your back buttons working, they are complex and usually written in a specific framework, so if you want to use them well your going to be adding a lot more code then you thought to your web site. Plus this is how Gmail and Facebook do it, you won’t find there code or get any help from them on the topic so I decided to build it myself so everyone could get the benefits of Ajax URL navigation. Below is an example of a simple yet elegant Ajax Pagination system I’ve written to relieve the navigation hicups Ajax causes.

Demo

View Demo :: MooTools
View Demo :: jQuery

Keep Reading...