Discussion :

[Devilju69]

Bonjour,
J'ai besoin de votre aide.
Je souhaite que lorsque je clic sur un lien de mon site, il y a une petite image chargement qui s'affiche en attendant le chargement de la page suivante.
Merci d'avance de votre aide

[Doksuri]

tu ne peux pas vraiment faire ca nativement. quand tu change de page, c'est le navigateur qui se charge de tout.

par contre, ce que tu peux faire (si c'est a ca que tu pensais) c'est que tout le contenu de toutes tes pages se chargent en ajax. (mais si tu es debutant) ca risque d'etre complique

[arthur57]

Bonjour,

En effet d'une page à l'autre c'est le navigateur qui s'en occupe.
Mais tu peux toujours mettre une image chargement au OnLoad de ta page
exemple simple

Cordialement

[Devilju69]

Donc ce n'est pas possible d'afficher une image immédiatement après un clic ?

[arthur57]

Donc ce n'est pas possible d'afficher une image immédiatement après un clic ?

C'est plus très clair pour ma part, le clic = une nouvelle page web ?
Quand souhaites-tu afficher ton image exactement ?

[Devilju69]

Lorsque l'on clique sur un lien, oui cela ouvre une nouvelle page mais de temps en temps le site met du temps à basculer sur la nouvelle page ; et pendant ce temps d'attente, juste une image loading pour pas que la personne clic une deuxième fois.

[ma5t3r]

Un exemple simple

L'image dans ta page HTML

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
    <a class="myImgWrapper" href="maPagePHP.php"><img src="monImage.jpg" alt=""></a>

Le script dans ton fichier JS

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
 $('.myImgWrapper').on('click', function(e) {
        let html = "<div style='position:absolute;top:0;bottom:0;width:100%;height:100%;background-color:#fff'><div style='text-align:center'>ceci est un test</div></div>";
        $('body').append(html);
    })

Un bon CSS derrière tout ça et ça le fait (ça devrait le faire) :-)