Wordpress ajax pagination

I'm using this piece of code i found from a tutorial to enable Ajax pagination on my wordpress site. It all works find but i'd like to enhance it slightly.

At the moment when you click the next page button there is a slight pause where nothing happens. I'd like to display one of the "waiting" type images like this (http://www.costacruises.co.uk/B2C/Images/Skin/Default/gfx/ico_waiting.gif) but unsure of how i'd do this.

Heres the code i'm using.

jQuery('#postPagination a').live('click', function(e){
    e.preventDefault();
    var link = jQuery(this).attr('href');
    jQuery('#content-inner').fadeOut(500).load(link + ' #content-inner', function(){ jQuery('#content-inner').fadeIn(500); });
});

Thanks

Answers


You need to create the "loading" element, position it correctly with CSS and set to display:none. jQuery's fadeOut and fadeIn functions support specification of callbacks, so you would change the above code to something more like this

jQuery('#postPagination a').live('click', function(e){
    e.preventDefault();
    var link = jQuery(this).attr('href');
    jQuery('#content-inner').fadeOut(500, function(){
            jQuery("#spinner").show();
    }).load(link + ' #content-inner', function(){ jQuery('#content-inner').fadeIn(500, function(){
            jQuery("#spinner").hide();
    }); });
});

changing "#spinner" to the id or class of your loading element.


Need Your Help

Make Method Re-usable

java oop

I asked a similar question earlier today, but now I am told that the requirements have changed.

Using MSXML2.XMLHTTP in Excel VBA to extract large amounts of text data from website

excel vba msxml html-content-extraction

This is my first post here so kindly ignore any mistakes in convention. I have searched long and hard for a solution to this problem on StackOverflow and Google but to no avail.

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.