Soyez le premier à donner votre avis sur cette source.
Snippet vu 18 923 fois - Téléchargée 30 fois
var time = 1.5; // temps en seconde aprés lequel la bar de chargement disparait une finie var color = "#006699"; // couleur de la bar de chargement var bgcolor = "#000033"; // fond de la bar de chargement ( ce qui n'est pas encore charger ) var font = "monospace"; // Police du text du chargement var maxtime = 60; // temps maximum aprés lequel la bar de chargement disparait /* PAs touche */ var done = 0; time = time * 1000; maxtime = maxtime * 1000; loaded = new Array(); function getElement( element ) { if ( document.getElementById ) { return document.getElementById( element ); } else { if ( document.layers ) { return document.element; } else { return document.all.element; } } } function Pre_load() { for( index = 0; index < document.images.length; index++ ) { loaded[ index ] = false; } done = 0; } document.writeln( '<div id="Loading_Img" style="border:1 red solid;position:absolute;left:35%;top:35%;background-color:white;"></div>' ); window.setTimeout( "getElement( 'Loading_Img' ).style.visibility='hidden';", maxtime ); function Preload_Img() { imgs = document.images; for( index = 0; index < imgs.length; index++ ) { if( done >= imgs.length ) { break; } else if( imgs[ index ].complete && loaded[ index ] == false ) { done++; loaded[ index ] = true; } } if( done >= imgs.length ) { window.setTimeout( "getElement( 'Loading_Img' ).style.visibility='hidden';", time ); } else { window.setTimeout( "Preload_Img()", '50' ); } PRC = Math.round( ( ( done / imgs.length ) * 100 ) ); preview = '<table border="0" style="font-family:' + font + ';">'+ ' <tr>'+ ' <td> </td>'+ ' <td> </td>'+ ' <td> </td>'+ ' </tr>'+ ' <tr>'+ ' <td> </td>'+ ' <td style="color:red;text-align:center;"> Chargement : ' + PRC + '%<br>( ' + done + ' / ' + imgs.length + ' ) image(s)</td>'+ ' <td> </td>'+ ' </tr>'+ ' <tr>'+ ' <td> </td>'+ ' <td>'+ ' <span style="background-color:' + bgcolor + ';width:200px;border:1 red solid;">'+ ' <span style="background-color:' + color + ';width:' + PRC * 2 + 'px;">'+ ' </span>'+ ' </span>'+ ' </td>'+ ' <td> </td>'+ ' </tr>'+ ' <tr>'+ ' <td> </td>'+ ' <td> </td>'+ ' <td> </td>'+ ' </tr>'+ '</table>'; getElement( 'Loading_Img' ).innerHTML = preview; } Pre_load(); Preload_Img();
1 mars 2013 à 17:59
Pour le positionnement du cadre, laissez tomber. Après quelques tâtonnements, j'ai réussi à le placer où je voulais.
28 févr. 2013 à 17:24
J'ai passé l'après-midi à essayer des trucs. Rien n'y fait. Mais je ne suis pas un expert. Y-a-t-il une erreur dans le code ?
J'aurais aimé aussi pouvoir placer le cadre de préchargement au centre de l'écran. Toutes mes tentatives de changer la position
ont échoué, même en vidant le cache de mon navigateur. Pouvez-vous m'aider ?
23 févr. 2008 à 08:58
19 janv. 2008 à 17:27
En fait ma barre de chargement est toute moche seulement avec Firefox (que j'utilise 99% du temps). J'ai testé avec IE et la barre est vraiment mieux.
En fait, j'ai vu d'où venait le souci d'affichage :
la syntaxe CSS est mauvaise, et comme Firefox respecte les normes (contrairement à IE qui s'en fout), il a pas aimé.
Il faut remplacer :
style="border:1 red solid;position:absolute;left:35%;top:35%;background-color:white;" ligne 41
Par :
style="border:1;border-color:red;border-style:solid;position:absolute;left:35%;top:35%;background-color:white;"
Et de même, remplacer la ligne 86 :
style="background-color:' + bgcolor + ';width:200px;border:1 red solid;"
Par :
style="background-color:' + bgcolor + ';width:200px;border:1;border-color:red;border-style:solid;"
Ceci résolut le problème des bordures, mais on ne voit toujours pas l'évolution du chargement de la barre.
Je vais essayer de trouver une solution ...
19 janv. 2008 à 16:50
http://philippedomergue.free.fr/index2.html
Sur le menu (à gauche) et sur la page Œuvres.
Plusieurs "soucis" :
- Depuis que j'ai mis le script, j'ai une barre de défilement horizontale qui est apparue en bas de mon menu.
- La barre s'affiche même lorsque les images sont déjà mises en cache (quand on actualise la même page).
- Pour mon menu, j'aimerais faire en sorte que les images se pré-chargent, mais que la barre de chargement ne s'affiche pas. Quelle partie(s) du code je dois enlever ?
Bon, voilà. Désolé de bombarder de questions comme ça, mais je pense que ça pourra aussi être utile à d'autres utilisateurs :)
Vous n'êtes pas encore membre ?
inscrivez-vous, c'est gratuit et ça prend moins d'une minute !
Les membres obtiennent plus de réponses que les utilisateurs anonymes.
Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.
Le fait d'être membre vous permet d'avoir des options supplémentaires.