Jquery ajax-loading-image

[Mike89]

Hi

Ich suche und probiere jetzt schon seit zwei stunden und komm nicht weiter, hoffe ihr könnt mir helfen.

Ich habe ein Menü und den Hauptbereich der Seite. Wenn ich auf einen Menüpunkt klicke wird per ajax der Inhalt in den Hauptbereich geladen. Das funktioniert super.

Ich möchte nun ein Bild anzeigen falls das laden etwas länger dauert, und zwar neben dem Menüpunkt der gerade ausgewählt wurde.

Ich habe bis jetzt eine Klasse(Lade-Grafik + Position im Menü) die ich einblende wenn der Menüpunkt angeklickt wird.
Und in der Datei die geladen wird steht am Ende der Code um die Klasse und somit das Ladebild wieder zu entfernen. Das funktionert auch.

  
index.php  
$('#menu1').click(function(){  
  $('#menu1').addClass('menupunkt_load_grafik');  
  $("#hauptbereich").load("s1.php");  
});		  
$('#menu2').click(function(){  
  $('#menu2').addClass('menupunkt_load_grafik');  
  $("#hauptbereich").load("s2.php");  
});		  
  
s1.php  
..  
$('#menu1').removeClass('menupunkt_load_grafik');  
  
s2.php  
..  
$('#menu2').removeClass('menupunkt_load_grafik');  

Nun möchte ich aber die Ladegrafik erst einblenden wenn das laden länger als zB 500ms dauert.

danke für eure hilfe

mfg mike

[suit]

Verwende "ajax()" anstatt "load()" und bau bei der Lade-Geschichte ein wait() ein (siehe Cookbook, nicht built-in).

[Mike89]

Verwende "ajax()" anstatt "load()" und bau bei der Lade-Geschichte ein wait() ein (siehe Cookbook, nicht built-in).

Hat jemand ein Beispiel ich bekomme das selber nicht hin :(

danke mfg

[suit]

Hat jemand ein Beispiel ich bekomme das selber nicht hin :(

Die jQuery-Dokumentation hat Beispiele - hast du dir die schon angesehen?