DKSPROGRESSBAR : UNE PROGRESSBAR IMAGÉE QUI CHANGE DE COULEUR SELON LA PROGRESSI

mickaelpfr Messages postés 197 Date d'inscription mardi 18 février 2003 Statut Membre Dernière intervention 29 avril 2009 - 21 janv. 2008 à 09:36
cs_ludovique Messages postés 2 Date d'inscription mardi 29 juillet 2008 Statut Membre Dernière intervention 2 novembre 2008 - 2 nov. 2008 à 20:57
Cette discussion concerne un article du site. Pour la consulter dans son contexte d'origine, cliquez sur le lien ci-dessous.

https://codes-sources.commentcamarche.net/source/45472-dksprogressbar-une-progressbar-imagee-qui-change-de-couleur-selon-la-progression

cs_ludovique Messages postés 2 Date d'inscription mardi 29 juillet 2008 Statut Membre Dernière intervention 2 novembre 2008
2 nov. 2008 à 20:57
bonsoir,
je suis nouveau dans la création de site et j'aimerai mettre une progressbar sur mon site en dreamweaver cs3 qui comporte dans l'immédiat q'une page d'accueil.
je cherche depuis 2 jour comment faire, mais aucun tutoriaux concrets sont disponiblent
je bidouille donc sous flash avec des bouts de codes enregistré en flash que j'importe dans dream mais rien de réellement efficace.
je suis plus graphiste dans l'ame que programmeur j'y vais à mon rythme...

auriez vous un tutorial concret pour une progressbar sur un site dreamweaver cs3

Bien cordialement
the_wwt Messages postés 177 Date d'inscription jeudi 5 octobre 2006 Statut Membre Dernière intervention 16 janvier 2009 1
1 févr. 2008 à 11:48
Bonjour,
Le rendu est sympa bien joué.
Seul bémol c'est géré avec des images, j'ai déposé une source entièrement OO qui a à peu près le même rendu en pur javascript.
http://www.javascriptfr.com/codes/PROGRESS-BAR-WIDGET_45586.aspx
Bonne continuation,
Pierrick
TheSin Messages postés 331 Date d'inscription mardi 12 novembre 2002 Statut Membre Dernière intervention 10 février 2009
22 janv. 2008 à 21:24
J'ai oublié de préciser que c'est la Démo mise en ligne que j'ai testé.
Sinon, comme d'habitude avec IE c'est un objet attendu, ligne 72 caractère 1.
En espérant pouvoir lire une compatibilité du code, sinon exit et ça serait dommage :(.
cs_DARKSIDIOUS Messages postés 15814 Date d'inscription jeudi 8 août 2002 Statut Membre Dernière intervention 4 mars 2013 130
22 janv. 2008 à 21:02
tiens, ca marche pas avec IE7 ??? Quelle est l'erreur au juste ?
TheSin Messages postés 331 Date d'inscription mardi 12 novembre 2002 Statut Membre Dernière intervention 10 février 2009
22 janv. 2008 à 20:24
Dommage, ça ne marche pas avec IE7 Vista tandis que FF no soucis ....
mickaelpfr Messages postés 197 Date d'inscription mardi 18 février 2003 Statut Membre Dernière intervention 29 avril 2009 2
22 janv. 2008 à 10:09
Bon hé bien sans paul et mickey , modifis la description ça t'évitera quelques autres commentaires désagréable ;) mais bonne initiative quand même que le partage de ta source :)
cs_DARKSIDIOUS Messages postés 15814 Date d'inscription jeudi 8 août 2002 Statut Membre Dernière intervention 4 mars 2013 130
22 janv. 2008 à 06:25
Le but est tout de même d'afficher une image différente selon la progression : ici j'utilise 11 images avec une couleur différente pour simuler une progression passant du rouge au vert sans que ca soit réellement perceptible. Mais c'est sûr qu'au final mon code ressemble au tiens pour afficher une progression avec une simple couleur.
Arto_8000 Messages postés 1044 Date d'inscription lundi 7 mars 2005 Statut Membre Dernière intervention 13 juillet 2010 7
22 janv. 2008 à 02:10
Je sais pas pourquoi ils sont chargé trois fois, mais quand j'ouvre Firebug et que je regardes les requêtes faites, je vois que les images sont requester plusieurs fois. Firebug c'est l'outil à tout faire pour les dévellopeur web, tu devrais le télécharger et tu verras par toi même. Laisse rouler ton script pendant un petit temps et de nouvelles requêtes apparaissent ... ceux là pas voulu.

Et en passant tant qu'à juste faire une animation de chargement ...

<html>
<head>
<script type="text/javascript" language="Javascript">
var p=0;
function a()
{
document.getElementById("d").style.width = 1 + (p++) * 2 + "px";
if (p != 100)
setTimeout("a()", 25);
}
</script>
</head>




 




</html>

Ça aussi ça fait juste une animation de chargement ...
cs_DARKSIDIOUS Messages postés 15814 Date d'inscription jeudi 8 août 2002 Statut Membre Dernière intervention 4 mars 2013 130
21 janv. 2008 à 21:51
Le but de cette source n'est pas de montrer la progression du chargement des images, mais juste faire une progressbar : vous pouvez la remplir comme vous voulez (il suffit de lui indiquer quel pourcentage vous voulez afficher) c'est tout. Il n'y a aucune particularité concernant le chargement des images (ce ne sont que les images qui sont affichées pour simuler un progressbar).

Donc mickaelpfr, t'avais raison : je me base sur rien pour faire ma barre de load : c'était le but :p

par contre, arto_8000, tu peux m'expliquer pourquoi se charge jusqu'à trois fois les images ? Je suis en train de faire un jeu de carte en pur javascript (comme worldofsolitaire.com) que je déposerais ici lorsqu'il sera fini, et ce script me permet justement d'afficher une progressbar lors de la mise en cache des images (et je vous rassure, le préchargement des images est bien plus évolué qu'ici ;) et j'aimerai l'optimiser, donc du coup si pour un script aussi peu évolué, je charge déjà 3 fois les mêmes images, cà part mal !
Arto_8000 Messages postés 1044 Date d'inscription lundi 7 mars 2005 Statut Membre Dernière intervention 13 juillet 2010 7
21 janv. 2008 à 15:46
Comme ça été dit précédemment tu te bases sur rien pour à savoir si tes images sont chargés. Peut-être que tes images sont encore en chargement alors que la bar indique qu'elles sont toutes chargées. Aussi tu ne devrais pas utiliser l'événement onLoad, depuis un bon bout il y a l'événement onDOMContentLoaded qui est plus approprié pour ce genre de script. Et tant qu'à seulement mettre les images en cache pourquoi pas utiliser AJAX au lieu d'une méthode que je doutes de l'efficacité.

Je ne sais pas si c'est un bug ou voulu, mais sur ton site de démo les images sont chargées jusqu'à trois fois.

Il reste encore du travail et bonne chance.
mickaelpfr Messages postés 197 Date d'inscription mardi 18 février 2003 Statut Membre Dernière intervention 29 avril 2009 2
21 janv. 2008 à 13:52
pas eu la possibilitée d'éditer mon message , voici la source dont je te parlais :
http://www.javascriptfr.com/code.aspx?ID=37087
mickaelpfr Messages postés 197 Date d'inscription mardi 18 février 2003 Statut Membre Dernière intervention 29 avril 2009 2
21 janv. 2008 à 13:43
je viens de regarder ta source en entier et effectivement , tu ne t'appuis sur rien pour faire ta barre de load, uniquement sur un nombre d'éléments ...
Pour pouvoir faire une vrai barre de chargement d'images il aurait fallut que tu ajoutes une fonction de vérification de chargement de chaque image via la méthode .complete , regarde sur ce site il y a une fonction qui indique le chargement du nombre d'images :)

Bon courage
cs_DARKSIDIOUS Messages postés 15814 Date d'inscription jeudi 8 août 2002 Statut Membre Dernière intervention 4 mars 2013 130
21 janv. 2008 à 12:58
Si tu regarde dans le code, tu verra un "setPercentage" qui permet de définir le pourcentage de progression.
mickaelpfr Messages postés 197 Date d'inscription mardi 18 février 2003 Statut Membre Dernière intervention 29 avril 2009 2
21 janv. 2008 à 09:36
je n'ai pas vue en quoi ta barre indiquait une progression ?
c'est juste une animation !
ou alors il manque une subtilité ....

je note 3 . . .
Rejoignez-nous