Wordpress ajax Paginierung

Question

Ich verwende dieses Stück Code, den ich in einem Tutorial gefunden habe, um Ajax Paginierung auf meiner Wordpress-Site zu ermöglichen. Es funktioniert alles, aber ich möchte es etwas verbessern.

In dem Moment, als Sie auf die Schaltfläche für die nächste Seite klicken, gibt es eine kleine Pause, in der nichts passiert. Ich würde gerne einen der "wartenden" Bilder wie diesen (http://www.costacruises.co.uk/B2C/Images/Skin/Default/gfx/ico_waiting.gif) anzeigen, aber ich bin mir nicht sicher, wie ich das machen würde mach das.

Heres der Code, den ich verwende.

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); }); 
}); 

Dank

Answer 1

Sie müssen das „Laden“ Element, positionieren Sie es richtig mit CSS und auf Anzeige erstellen: keine. jQuery fadeOut und fadeIn Funktionen unterstützen Spezifikation der Rückrufe, so würden Sie den obigen Code, um etwas mehr ändern wie diese

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(); 
    }); }); 
}); 

Ändern „#spinner“ auf die ID oder Klasse Ihres Belastungselement.