Discussion :

[nicoreims]

Bonjour,

Je souhaite mettre en place cette animation en cercle pour le chargement d'une page (temps de chargement suite à requete mysql).

https://www.jqueryscript.net/loading...g-spinner.html

var $loader = $("#loader");
Start the loading indicator with .gSpinner():

$loader.gSpinner();
We can scale down the default size of the spinner by passing an options object where we specify the scale of the spinner relative to it's default size, 200x200px:

Hide the loading indicator with .gSpinner("hide"):

$loader.gSpinner("hide");

Sur la démo, le déclenchement se fait via des boutons, mais je ne sais pas comment procéder pour créer un déclenchement en mettant l'appel en haut de la page et en bas de la page pour arrêter l'animation.

Merci d'avance !
Nicolas

[Toufik83]

pour que l’animation se déclenche au chargement de la page ajoute

Code :

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

handleStartClick();

a la fin du fichier demo.js.

pour le scroll :ajoute ce bout de code dans la partie script de la page index.html

Code :

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

1
2
3
4
5
6
7
8
9
10
 
$(document).on('scroll',function(){
	if(parseInt($(window).scrollTop()+$(window).height())==parseInt($(document).height())){
	   console.log('fin de page scroll');
	   handleStopClick();//stopper l'annimation
	}else{
		handleStartClick();//demarrer l'annimation
	}
 
  });

[nicoreims]

Bonjour,

merci Toufik , impeccable l'animation se lance automatiquement.

Par contre je me suis mal exprimé, c'est quand la page est terminée d'être chargée que je souhaitais que l'animation s’arrête.

C'est pour cela que je pensais qu'il fallait mettre une commande à la fin de la page pour l'arret.

Merci d'avance

[Toufik83]

Code :

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

1
2
3
$(document).ready(function(){
//ici Le document est prêt, ton code devrai être ici
});

Tu peux utiliser setTimeout en intérne

[nicoreims]

Merci beaucoup ça fonctionne !

Code :

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

1
2
3
4
5
6
7
  <script> 
$(document).ready(function(){
 handleStopClick();
});
 
 
    </script>

[Toufik83]

Il y'a mieux

Code :

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

1
2
3
4
5
6
 
$(document).ready(function(){
handleStartClick();
setTimeout(function(){
handleStopClick();},10);
});