jQuery Progression est un plugin pour jQuery permettant la mise en place de barre de progression dynamiques.
Elles peuvent facilement être utilisées dans la gestion de taches, des jeux par navigateurs...

Copyright (c) FOURNET Loïc
Publié sous Licence MIT, et la License GPL.

Caractéristiques

  • Non obstrusif
  • Nombreuses options disponibles
  • Compatible MetaData
  • Compatible Easing

Démonstration

<loc>http://www.anthor.net/fr/jquery-progression-demo-simple.html</loc> <loc>http://www.anthor.net/fr/jquery-progression-demo-change-defaut.html</loc> <loc>http://www.anthor.net/fr/jquery-progression-demo-metadata.html</loc> <loc>http://www.anthor.net/fr/jquery-progression-demo-easing.html</loc>

Utilisation

Code Javascript
<script type="text/javascript" src="_js/jquery.progression.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		$('.progressbar').progression();
	});
</script>
Code CSS
.progressbar {
	border:1px solid #000000;
	width: 200px;
	height: 20px;
	line-height: 20px;
	text-align: center;
}
Code HTML
<div class="progressbar">50</div>

Options disponibles

Current

Valeur par défaut : 50
Description : Définit la valeur de la barre de progression.

Maximum

Valeur par défaut : 100
Description : Définit la valeur maximum de la barre.

Background

Valeur par défaut : '#FFFFFF'
Description : Définit la couleur de fond de la barre.

BackgroundImg

Description : Définit une image de fond pour la partie inactive.

TextColor

Valeur par défaut : '#000000'
Description : Définit la couleur du texte de la barre.

aBackground

Valeur par défaut : '#FF0000'
Description : Définit la couleur de fond active.

aBackgroundImg

Description : Définit une image de fond pour la partie active.

aTextColor

Valeur par défaut : '#FFFFFF'
Description : Définit la couleur de texte actif.

BorderColor

Valeur par défaut : '#000000'
Description : Définit la couleur de de la bordure.

Animate

Valeur par défaut : true
Description : Définit si le changement de valeur se avec ou sans animation.

AnimateTimeOut

Valeur par défaut : 1500
Description : Définit le temps d'exécution de l'animation.

Width

Valeur par défaut : Suivant la taille du bloc
Description : Définit la largeur de la barre.

Height

Valeur par défaut : Suivant la taille du bloc
Description : Définit la largeur de la barre.

Easing

Valeur par défaut : linear
Description : Définit l'animation à utiliser.

startFct

Valeur par défaut : null
Description : Permet de définir un callback en début d'animation.

endFct

Valeur par défaut : null
Description : Permet de définir un callback en fin d'animation.

Historique

1.3 - 03/03/2009
  • Ajout du callback startFct(options).
  • Ajout du callback endFct(options).
1.2.1 - 10/02/2008
  • Correction d'un bug empêchant de modifier les valeurs par défaut.
1.2 - 10/02/2008
  • Ajout de l'option 'Easing' pour définir un style d'animation.
  • Ajout de l'animation textuelle.
1.1.1 - 31/01/2008
  • Correction d'un bug réinitialisant la valeur Maximum en cas de changement.
1.1 - 20/01/2008
  • Correction d'un bug empêchant de changer la valeur d'une barre de progression si MetaData est utilisé.
  • Correction d'un bug permettant l'utilisation d'une valeur supérieur au maximum.
  • Ajout de l'option aBackgroundImg.
  • Ajout de l'option BackgroundImg.
1.0 - 17/01/2008</h3>
  • Première version.