Question

I am looking for a documented, cross-browser supported jQuery plugin that I can use to build a site like this:
http://redsquareagency.com/

As you can see, as you navigate through the site, the URL changes via a hash and all new pages are loaded via ajax calls instead of page loads. This allows for some neat animations to be used when a new page is loaded.

I’ve searched for a while trying to find a good plugin that provides this functionality. The best I can find is jQuery Ajaxy: http://balupton.com/sandbox/jquery-ajaxy/demo/

But, the documentation is lacking, and I found it incompatible with the latest jQuery version (1.6.0).

Anyone know of plugins that can accomplish this?

Answer 1

Hmmm I don’t think there is ONE plugin that does everything. But you can pretty much do some jquery your self with combination of jquery history plugin.

What you do do is write some code make all your hrefs load via AJAX. Like this –

$(document).ready(function() {
            $.history.init(loadContent);
            $('#navigation a').not('.external-link').click(function(e) {
                    var url = $(this).attr('href');
                    url = url.replace(/^.*#/, '');
                    $.history.load(url);
                    return false;
                });
        });

And that’s it. The jquery history plugin will take care of the rest. You should also read google’s documentation on how to do this properly for them to index it.