Conseils
Le composant de progression sert à communiquer visuellement l’avancement d’une tâche ou le statut d’achèvement d’un processus. Il est couramment utilisé dans les formulaires, les processus de paiement, les sondages et les écrans de chargement.
En règle générale, il est recommandé d’afficher une barre de progression lorsqu’une commande prend plus de 10 secondes à s’exécuter.
L’utilisation d’une barre de progression est réservée aux tâches dont il est possible de déterminer le pourcentage d’avancement à tout moment. Si l’application ne le permet pas, utilisez plutôt un composant d’indicateur de chargement.
Pour intégrer ce composant, insérez gnb-progress-1.0.0.js au bas de la page, avant la balise de fermeture du corps du document.
Barre de progression
HTML
<div class="gnb-progress">
<div id="gnb-progress-bar">5%</div>
</div>
<br>
<!-- Bouton qui déclenche la fonction 'move' pour exécuter la barre de progression -->
<button onclick="move()">Cliquer pour exécuter</button>
<!-- Ajoutez ceci en bas de votre page avant la balise de fermeture du corps -->
<script src="gnb-progress-1.0.0.js"></script>