Ajax chargement gif

Question

Je veux montrer le chargement gif pendant que je récupère mon contenu réel du serveur. Je sais comment y arriver si c'était juste ça. Le problème auquel je suis confronté est que je veux montrer ce gif de chargement comme une boîte modale. Quelqu'un peut-il aider?

Modifié: Voici ce que je fais dans mon code

$('#'+buttonId).click(function(){ 

     // Put an animated GIF image insight of content 
     $.colorbox({html:"<img src='/mysite/images/" + imageId + "'/>", open:true, opacity:"0.60"}); 

      // Make AJAX call 
      $('#'+ divId).load("/mysite/" + urlToLoad); 

    }); 

Ici, je suis en train d'utiliser colorbox pour la fonctionnalité modale et cela ne me donne la fenêtre modale ... mais la fenêtre reste ouverte même après que le contenu est chargé derrière.

Answer 1

Il est le même que si vous utilisiez une donnée gif de chargement

• d'appel de données de charge
• montrent modales
• chargé
• cacher modal

utilisez-vous jquery ou quelque chose comme ça?

Answer 2

Créez un div qui couvre tout et place l'image à l'intérieur. Obtenez la hauteur et la largeur du viewport via javascript pour définir la hauteur et la largeur du div, puis positionnez-le absolument à 0,0 avec un index z de 99.

Answer 3

Quelles bibliothèques JavaScript utilisez-vous? La plupart des bonnes bibliothèques JavaScript ont des plug-ins de boîtes modales très faciles à utiliser. Si vous codez vos applications JavaScript à la main, je vous recommande fortement de jeter un oeil à jQuery. Vous serez très heureux de la facilité avec laquelle vous apprendrez et utiliserez le support et les plugins de la communauté.

Answer 4

Merci pour toutes les réponses ci-dessus les gars. J'ai trouvé une solution à cela. Je viens de lire les docs jquery où vous pouvez spécifier une fonction de rappel dans le cadre de la fonction de chargement .... J'utilise cela pour fermer la boîte modale.