Affichage d'une image de chargement lors de l'actualisation de la page

Question

J'ai un extrait JavaScript qui force le chargement d'une page à l'aide de .reload (true) une fois que quelqu'un clique sur un lien particulier. Comment est-ce que je peux montrer une image de "chargement" simple pendant que l'actualisation de page a lieu?

(utilisez déjà jquery sur la page si cela aide)

Answer 1

Vous n'avez pas spécifié où vous vouliez l'image de chargement. Si vous voulez que les images elles-mêmes à « devenir » une image de chargement, commencez par décorer vos images comme si:

<img class="cl" 
    src="loading.gif" 
    onload="if(!this._done){this._done=true;this.src='real.jpg';}"/> 

Puis, avant d'appeler .reload, faire:

$('img.cl').attr('src','loading.gif'); 

D'autre part, si vous voulez le mettre dans un lieu fixe, il suffit de faire ainsi, mais marquer que div comme caché, comme dans:

<div id="rl">loading <img src="loading.gif"/></div> 
<noscript><style> 
#rl {display:none;} 
</style></noscript> 
<script><!-- 
document.write("<style>\ndiv#rl {display:block;}\n</style>"); 
$('#rl').hide(); 
//--></script> 

(peut-être vous aussi la position rl quelque part)

Ensuite, avant d'appeler reload, simplement reétrenner il:

$('#rl').show(); 

Answer 2

Découvrez jquery-loadmask plugin