begin process at 2012 02 11 23:50:21
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Divers

 > PRELOAD D'UNE PAGE AVEC BARRE DE PROGRESSION

PRELOAD D'UNE PAGE AVEC BARRE DE PROGRESSION


 Information sur la source

Note :
9,29 / 10 - par 7 personnes
9,29 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Divers Niveau :Initié Date de création :18/10/2003 Date de mise à jour :23/07/2004 15:10:18 Vu / téléchargé :50 534 / 8 977

Auteur : Nicoboss

Ecrire un message privé
Site perso
Commentaire sur cette source (31)
Ajouter un commentaire et/ou une note

 Description

Cliquez pour voir la capture en taille normale
Ce script permet de charger les images présentent dans une page avec une barre de chargement pour indiquer la progression.
Le zip contient le code, 2 images essentiel pour la barre de progression + 4 images pour vous faire un exemple.



 Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip


 Historique

23 juillet 2004 15:10:19 :
Cette mise à jour est la transformation des majuscules en mininuscules pour éviter des problèmes sur internet.

 Sources du même auteur

UNE LISTE GÉRÉE PAR COOKIES
NOTATION DE SITES
PETIT QUIZ
Source avec Zip CRÉATEUR SIMPLE DE PAGE WEB (EN ANGLAIS)
Source avec Zip PETIT SCRIPT DU GENRE MOTEUR DE RECHERCHE AVEC MOTS-CLÉS, NO...

 Sources de la même categorie

COLONNES ADAPTABLES EN HAUTEUR par dronoide
Source avec Zip VECTEURS ET MATRICES: OUTILS GRAPHIQUES UTILES par william voirol
Source avec Zip Source avec une capture HTML5 PLAYER par kazma
Source avec Zip Source avec une capture SCROLLBAR PERSONNALISABLE par kazma
Source avec Zip INFO BULLE par RudiRatlos

Commentaires et avis

Commentaire de granduc le 28/10/2003 12:08:35

Bravo, voici un script utile et sympa !
Mais je ne comprends pas encore pourquoi il fonctionne à merveille en local mais plus du tout sur mon serveur distant : Plus de décompte ni d'effacement du calque ...

Commentaire de ghostahjay le 25/02/2004 23:58:19

Super script! il va me servir pour un de mes projets car l'affichage est un peu long :) merci bcp et vive codes-sources!

Si MAJ mail moi stp :)

Commentaire de n3utr0n le 22/06/2004 14:54:01

très bon script,.

Commentaire de nay75 le 24/06/2004 22:28:24

Bonsoir,

J'ai le mme probleme que granduc.

Merci de votre aide

Commentaire de nay75 le 24/06/2004 22:28:44

Bonsoir,

J'ai le mme probleme que granduc.

Merci de votre aide

Commentaire de frank123 le 16/07/2004 16:15:12

Bonjour, je ne comprend pas aussi pourquoi que le chargement ne se fait pas. je vois les images qui se rouvre en bas.. sauf la premiere images de la gang!! Quoi faire?? peut-etre quelqu'un pourrait savoir comment ajouter un code pour charger l'image.. ou il manque peut-etre un code queque part? Je ne comprend pas tellement pourquoi! le chargement reste à 000% mais.. je crois que le trouble est en rapport avec la premiere image.. la premiere image a des problemes.. mais pourtant en local comme disais granduc.. sa marche à merveille! pourquoi sa ? ahha! je viens juste de trouver le problème!! c'est reglé!!! le problème est que quand que le compteur arrive à 100%.. sa fais planté l'animation.. ou sa fait de quoi du genre.. tout ce que vous avez à faire c'est cela :

document.get
var i=8; //Vous voyez.. la valeur est à 8.. donc.. il se rend à 90% au lieu de 100%.. mais.. sa peut s'arranger en taponant un peu
function preloadImage(){
var myContent = document.getElementsByTagName("img")
var totalImage = myContent.length
percent = Math.ceil((i+0)*100/totalImage) //la valeur (i+1) a été changé pour (i+0) comme ça.. aucune erreur n'affiche avec le chargement!!
Et Hop!! maintenant.. le problème est réglé! =)

Commentaire de frank123 le 16/07/2004 16:15:14

Bonjour, je ne comprend pas aussi pourquoi que le chargement ne se fait pas. je vois les images qui se rouvre en bas.. sauf la premiere images de la gang!! Quoi faire?? peut-etre quelqu'un pourrait savoir comment ajouter un code pour charger l'image.. ou il manque peut-etre un code queque part? Je ne comprend pas tellement pourquoi! le chargement reste à 000% mais.. je crois que le trouble est en rapport avec la premiere image.. la premiere image a des problemes.. mais pourtant en local comme disais granduc.. sa marche à merveille! pourquoi sa ? ahha! je viens juste de trouver le problème!! c'est reglé!!! le problème est que quand que le compteur arrive à 100%.. sa fais planté l'animation.. ou sa fait de quoi du genre.. tout ce que vous avez à faire c'est cela :

document.get
var i=8; //Vous voyez.. la valeur est à 8.. donc.. il se rend à 90% au lieu de 100%.. mais.. sa peut s'arranger en taponant un peu
function preloadImage(){
var myContent = document.getElementsByTagName("img")
var totalImage = myContent.length
percent = Math.ceil((i+0)*100/totalImage) //la valeur (i+1) a été changé pour (i+0) comme ça.. aucune erreur n'affiche avec le chargement!!
Et Hop!! maintenant.. le problème est réglé! =)

Commentaire de frank123 le 16/07/2004 16:58:57

Bonjour.. lisez bien ceci.. =P

var i=8; //jai mis 8... mais! c'est logique tout sa.. si vous comprenez bien.. 8 est multiplié par (i+0) et 100.. donc ce que sa donne c'est : 8 x 0 = 0 x 100 =0.. pourquoi sa donne 90?? aucune idée.. mais bon..
function preloadImage(){
var myContent = document.getElementsByTagName("img")
var totalImage = myContent.length
percent = Math.ceil((i+0)*100/totalImage)

En gros.. 100% va apparaitre seulement en faisant sa ici :

var i=2;
function preloadImage(){
var myContent = document.getElementsByTagName("img")
var totalImage = myContent.length
percent = Math.ceil((i+1)*100/totalImage)

Bien sur... encore un problème reviens.. celui que la barre rouge n'apparait pas.. mais! c'est le seul probleme.. alors soit que vous enlever completement cette bar.. ou que vous essayer d'arrangé sa. parce que.. en local.. tout marche.. mais sur internet.. ya que le pourcentage qui monte.. alors.. je me dis.. il y a soit un problème de calcul.. ou un code qui n'est pas bon.. qui sers à rien finalement .. si on ne lui donne pas les bonne config.. bon ! alors c'est votre choix! peut-être que je vais réussir à afficher la barre rouge! salut!

Commentaire de frank123 le 16/07/2004 17:20:52

HuMmm.. petite erreur niaiseuse dirait-on.. regarder bien.. =>

<TD align=middle bgColor=#2F4060>
      <DIV id=preloadPercent><FONT color=silver>[Veuillez attendre
      000%]</FONT></DIV><BR>
      <TABLE cellSpacing=0 cellPadding=1 width=100 border=0>
        <TBODY>
        <TR bgColor=#999999>
          <TD><IMG height=4 src="files/green.gif" width=0
            name=loadedGreen></TD>
          <TD><IMG height=4 src="files/red.gif" width=100
            name=loadedRed></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></DIV>

Vous voyez? jai changer le dossier où se trouve green.gif et red.gif.. L'erreur savez-vous c'était quoi?? C'était seulement que Preload_fichiers.. de 1 : sur internet.. on ne met jamais de majuscule aux fichiers. de 2 : sa marche maintenant !! ahah!! oui! la barre rouge marche #1 et le pourcentage également =))!! Donc!! peut-etre une révision du script serait une bonne idée =P

Commentaire de n3utr0n le 17/07/2004 00:30:40

Je me répète, mais c'est un très bon script. Surtout pour le preload d'image png24

Commentaire de and1hotsauce le 25/08/2004 21:38:50

Personne n aurait un script pour faire un preload de video.
En fait, un ami a fait une video d intro pour mon site, mais qd on el fait sois mm on arrive pas tjs a baisser un max pour garder une qualité assez bonne, dc j aimerai pouvoir preloder en fonction de la video, c' ets possible ??

a+, and1hotsauce

Commentaire de osiris666 le 28/09/2004 10:23:59

utilise flash sa sera mieu pour ton intro tu fait ton preload et ensuite tu met ton intro et sa ira tout seul

Commentaire de vassyl le 10/10/2004 19:54:00

bonjour, tout d'abord felicitation pour le script, l'effet est très bien réalisé...

p'tite question qui rejoint la précédente : comment faire un preload de video ? ok on utilise flash mais apres ? paske en decortiquant le script (je suis une nullité notoire en info) j'ai bien l'impression qu'il s'agit d'un preload detectant des images ( "img...") donc le format flash... bref je crois que g été assez clair :)

@+

Commentaire de vassyl le 10/10/2004 19:56:17

oups petit oubli... "preload detectant des images donc PAS le format flash (swf un truc du genre)" vala :)

Commentaire de vassyl le 10/10/2004 20:42:44

pour faire plus "général", c'est possible de faire un preload d'une page (avec barre de defilement) sans tenir compte de son contenu. je sais que pour qu'il y ait "chargement..." c'est possible, puis lorsque la page est integralement chargée elle apparait. mais est-ce possible pour voir le poucentage ? paske si la page met du temps à se charger, "chargement..." c bien joli mais apres 2 minutes tu te demande si ca a pas beugé... si oui, pouvez vous me donner la demarche à suivre (ou mieux le script lol) sachant que bon je suis plutot niais et inexperimenté (meme si je comprends a peu pres le langauge html)

merciiiiiiiii

Commentaire de vassyl le 10/10/2004 20:42:51

pour faire plus "général", c'est possible de faire un preload d'une page (avec barre de defilement) sans tenir compte de son contenu. je sais que pour qu'il y ait "chargement..." c'est possible, puis lorsque la page est integralement chargée elle apparait. mais est-ce possible pour voir le poucentage ? paske si la page met du temps à se charger, "chargement..." c bien joli mais apres 2 minutes tu te demande si ca a pas beugé... si oui, pouvez vous me donner la demarche à suivre (ou mieux le script lol) sachant que bon je suis plutot niais et inexperimenté (meme si je comprends a peu pres le langauge html)

merciiiiiiiii

Commentaire de Evil le 04/11/2004 07:36:38

Y'a pas que IE et Netscape dans la vie, y'a aussi Opera....

Commentaire de larsen44 le 10/02/2005 08:52:55

Bonjour et bravo pour ce code qui est je doit le dire excellent, moi j'ai tout de même un petit problême, je m'explique...
En fait je souhaite utiliser ce code pour permettre de précharger mon site constitué de pas mal de Jpeg et aussi de Gif animés...Je l'ai optimisé "à mon gout" au maximum mais pour une connexion bas débit c'est pas le top...Même si c'est vrai que ca va encore je n'arrive pas à inclure le code de mon site avec celui-ci.
En fait je fait en grand tableau avec menu déroulant...et ce grand tableau composé de toutes mes images ne se charge pas entierement il s'arrete à 77%.
J ai peut etre une idée mais...L'effet Survol est généré par des fonctions javascript égalment j'ai pris soin de faire en sorte que les variables ne se nomment pas de mm mais bon qui sait...Alors voila le code est dans le post qui suit...
Merci

Commentaire de larsen44 le 10/02/2005 08:54:06

MON CODE
<html>
<head>
<title>Accueil</title>
<script language="JavaScript" type="text/JavaScript">

var ie = document.all?true:false // On test le navigateur pour IE

onload = preloadImage // Appel de la function preloadImage() au chargement de la page. Peut etre remplacer par <body onload="preloadImage()">

function addZero(chiffre){ // Function qui ajoute un zero devant les chiffres
if (chiffre < 10) { chiffre = "0"+chiffre; }
if (chiffre < 100) { chiffre = "0"+chiffre; }
return chiffre;
}

var i=0; // On initialise le comptage des images a 0.
function preloadImage(){
var myContent = document.getElementsByTagName("img") // On repere les images contenu dans la page
var totalImage = myContent.length // Et on compte combien il y'en a
percent = Math.ceil((i+1)*100/totalImage) // A chaque passage dans la fonction, on calcule le pourcentage de i par rapport au nb d'image

if (i < totalImage){ // Si l'image traité n'est pas la derniere image du doc on execute ce qui suit.
if (myContent.item(i).complete) {  // si l'image i est chargée, on envoi le pourcentage dans le div
document.getElementById("preloadPercent").innerHTML = "[please wait " + addZero(percent) + "%]";
document.loadedGreen.style.width = percent // Et on redimension l'image rouge
document.loadedRed.style.width = 100-percent // pareil en consequence avec la verte.
i++ // On increment i, pour passer a l'image suivante
setTimeout(preloadImage) // Et hop, on repasse dans la fonction avec l'image suivante
}
} else { // Sinon, on deduit que les images ont toute été chargées, et on cache le preload.
if (!ie) document.getElementById("preloadCache").style.visibility = "hidden"; // Si le client n'est pas IE on vire tout simplement le cache
else crosoftFade() // Sinon on applique un effet de fade progressif en appelant la fonction crosoftFade()
}
}

var opacity = 100 // Opacity de depart
function crosoftFade(){
opacity -= 25; // Opacity -25 a chaque passage
document.getElementById("preloadCache").style.filter = "progid:DXImageTransform.Microsoft.Alpha(opacity=" + opacity + ")";
if (opacity > 0) setTimeout(crosoftFade); // On passe cette fonction en boucle tant que le cache n'a pas disparu
else document.getElementById("preloadCache").style.visibility = "hidden";
}

</SCRIPT>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
  var c,x,a=document.MM_sr; for(c=0;a&&c<a.length&&(x=a[c])&&x.oSrc;c++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var c,j=d.MM_p.length,a=MM_preloadImages.arguments; for(c=0; c<a.length; c++)
    if (a[c].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[c];}}
}

function MM_findObj(n, d) { //v4.01
  var p,c,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (c=0;!x&&c<d.forms.length;c++) x=d.forms[c][n];
  for(c=0;!x&&d.layers&&c<d.layers.length;c++) x=MM_findObj(n,d.layers[c].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var c,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(c=0;c<(a.length-2);c+=3)
   if ((x=MM_findObj(a[c]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[c+2];}
}
//-->
</SCRIPT>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<body bgcolor="#CCCCCC" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<DIV id=preloadCache style="Z-INDEX: 123; LEFT: 0px; WIDTH: 100%; POSITION: absolute; TOP: 0px; HEIGHT: 100%">
<TABLE height="100%" cellSpacing=0 cellPadding=0 width="100%" border=0>
   <TBODY>
   <TR>
     <TD align=middle bgColor=#CCCCCC>
       <DIV id=preloadPercent><FONT color=#999999>[please wait         000%]</DIV><BR>
       <TABLE cellSpacing=0 cellPadding=1 width=100 border=0>
         <TBODY>
         <TR bgColor=#999999>
           <TD><IMG height=4 src="preload/green.gif" width=0 name=loadedGreen></TD>
           <TD><IMG height=4 src="preload/red.gif" width=100 name=loadedRed></TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
</TBODY>
</TABLE>
</DIV><!-- fin du cache -->
<table id="Tableau_01" width="800" height="601" border="0" cellpadding="0" cellspacing="0" align="center">
<tr>
<td colspan="8">
<img src="preload/index_01.gif" width="800" height="18" alt=""></td>
</tr>
<tr>
<td rowspan="2">
<img src="preload/index_02.gif" width="117" height="89" alt=""></td>
<td colspan="6"> <img src="preload/banniere.gif" width="563" height="68"></td>
<td>
<img src="preload/index_04.jpg" width="120" height="68" alt=""></td>
</tr>
<tr>
<td colspan="7">
<img src="preload/index_05.gif" width="683" height="21" alt=""></td>
</tr>
<tr>
<td> <a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image26','','preload/accueilr.jpg',1)"><img src="preload/accueil.jpg" alt="Accueil" name="Image26" width="117" height="63" border="0"></a></td>
<td> <a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image27','','preload/zikr.jpg',1)"><img src="preload/zik.jpg" alt="Muzik" name="Image27" width="109" height="63" border="0"></a></td>
<td colspan="2"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image28','','preload/clubbingr.jpg',1)"><img src="preload/clubbing.jpg" alt="Clubbing" name="Image28" width="111" height="63" border="0"></a></td>
<td> <a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image29','','preload/tvciner.jpg',1)"><img src="preload/tvcine.jpg" alt="Tv Ciné" name="Image29" width="112" height="63" border="0"></a></td>
<td> <a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image30','','preload/consolesr.jpg',1)"><img src="preload/consoles.jpg" alt="Consoles" name="Image30" width="113" height="63" border="0"></a></td>
<td> <a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image31','','preload/contactr.jpg',1)"><img src="preload/contact.jpg" alt="Contacts" name="Image31" width="118" height="63" border="0"></a></td>
<td> <a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image32','','preload/lienr.jpg',1)"><img src="preload/lien.jpg" alt="Liens" name="Image32" width="120" height="63" border="0"></a></td>
</tr>
<tr>
<td colspan="3">
<img src="preload/titre_page.jpg" width="297" height="52" alt=""></td>
<td colspan="2">
<img src="preload/index_14.gif" width="152" height="52" alt=""></td>
<td colspan="3">
<img src="preload/index_15.gif" width="351" height="52" alt=""></td>
</tr>
<tr>
<td background="preload/principal.gif" width="800" height="351" colspan="8" valign="top">
<table width="800" height="338">
<tr >
   <td height="49" align="left" valign="top">
  <p align="center"><font color="#FFFFFF" size="5">Salut les gens,</font>                              </p></td>
</tr>
   <tr>
<td height="280" valign="top">
  <blockquote>
  <blockquote>
  <blockquote>
      <p align="justify"><font color="#FFFFFF" size="4">
  heureux de vous parmis la communaut&eacute; des Djs/Clubbers, au programme plein de bonne choses, allez...!!!<br>
  Mes mix datant de Novembre 2004 ( les prochains sont en cours...), des news sur les balouzes sortant bient&ocirc;t ou d&eacute;ja dans les bacs.<br>
  Ibiza pour les plus clubbers d'entre vous...y'a de quoi se r&eacute;galer dans tout les sens du terme.<br>
  Une rubrique Tv/Cin&eacute; pour vous montrer mes p&eacute;ch&eacute;s mignons, l'univers du petit comme du grand &eacute;cran fait en effet aussi parti de mes hobbies.<br>
  Pour ce qui est Clubbing un aper&ccedil;u des quelques-unes discoth&egrave;ques pour lesquelles j'ai des coup de coeur, ou des clins d'oeil &agrave; faire.<br>
  Vous &ecirc;tes fan de Rpg ??? La rubrique console vous est pr&eacute;destin&eacute;e...je ne vous en dit pas plus. <br>
                                  Enfin la page de liens, avec les potos qui ont pu me filer un coup de pouce. </font><br>
       </p>
    </blockquote>
  </blockquote></blockquote>
   </td>
</tr>
</table>
  </td>
</tr>
<tr>
<td background="preload/index_17.gif" valign="top" width="800" height="15" colspan="8"><div align="center">
  <p><font color="#FFFFFF" size="4">Bonne visite Ciao-Ciao ! </font> </p>
</div></td>
</tr>
<tr>
<td colspan="8">
<img src="preload/index_18.gif" width="800" height="12" alt=""></td>
</tr>
<tr>
<td>
<img src="preload/spacer.gif" width="117" height="1" alt=""></td>
<td>
<img src="preload/spacer.gif" width="109" height="1" alt=""></td>
<td>
<img src="img/spacer.gif" width="71" height="1" alt=""></td>
<td>
<img src="preload/spacer.gif" width="40" height="1" alt=""></td>
<td>
<img src="preload/spacer.gif" width="112" height="1" alt=""></td>
<td>
<img src="preload/spacer.gif" width="113" height="1" alt=""></td>
<td>
<img src="preload/spacer.gif" width="118" height="1" alt=""></td>
<td>
<img src="preload/spacer.gif" width="120" height="1" alt=""></td>
</tr>
</table>
</body>
</html>

Commentaire de redemption le 20/02/2005 20:06:04

salut. j'ai vu ton code. il est nikel. par contre j'aimerai qu'au lieu de me faire un crossfade sur la page elle meme, qu'il me redirige vers une nouvelle page dès qu'il a terminer le chargement

Commentaire de aaries le 25/02/2005 10:40:45

Bonjour,

Comment faire pour preloader des images contenu dans un dossier et non les images de la page ?
Est-ce que programme télécharge aussi les images contenu dans les Iframe d'une page ?


Commentaire de a_carton le 07/04/2005 17:31:05

Je m'arrache les cheveux !
J'ai beau essayer de copier/coller le code en respectant les emplacements mais rien à faire, ça ne marche ni en local, ni en réseau :\

Tout du moins, j'ai réussi une fois à avoir quelque chose qui semblait marcher en local, et encore, je ne suis pas sûr qu'il préchargeait vraiment les images.

De plus, dans mon code initial, Golive m'inscrit déjà des "preload" un peu de partout (j'utilise bcp de roll over) alors je me demande si tout ça ne rentre pas en conflit quelque part ? Ou tout simplement, ce "preload de page" est-il compatible avec Golive CS ?

Pour finir je ne voudrais pas abuser, mais est-ce que quelqu'un saurait me placer (aux bons endroits) le code dans ma page ? J'abuse un peu c'est clair...
J'ai tout essayé et depuis une semaine je tourne en rond !!! Alors ça serait sympa de me montrer où est-ce que le code se place, ça me donnerai un exemple concrêt pour les autres pages.

Pour vous faire une idée plus précise de mon site :
http://nicolas.davidcavaz.free.fr

Par avance un grand merci !!!

Mon code de page initiale (sous Golive CS) :

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<meta name="generator" content="Adobe GoLive">
<title>NDC - Accueil</title>
<meta name="keywords" content="Audiovisuelle, R&eacute;alisateur, r&eacute;alisation, cam&eacute;raman, cameraman, corporatif">
<csscriptdict import>
<script type="text/javascript" src="GeneratedItems/CSScriptLib.js"></script>
</csscriptdict>
<csactiondict>
<script type="text/javascript"><!--
var preloadFlag = true;
function preloadImages() {
if (document.images) {
pre_Services_20__20Roll_20over = newImage('Liens%20Menu/Exp%e9rience%20-%20Roll%20over.gif');
pre_Tarifs_20__20Roll_20over = newImage('Liens%20Menu/Tarifs%20-%20Roll%20over.gif');
pre_Travaux_20__20Roll_20over = newImage('Liens%20Menu/R%e9alisations%20-%20Roll%20over.gif');
pre_Parcours_20__20Roll_20over = newImage('Liens%20Menu/Parcours%20-%20Roll%20over.gif');
pre_Contact_20__20Roll_20over = newImage('Liens%20Menu/Contact%20-%20Roll%20over.gif');
pre_Nico_20__20Roll_20over = newImage('Liens%20Menu/Nico%20-%20Roll%20over.gif');
preloadFlag = true;
}
}

// --></script>
</csactiondict>

<body onload="preloadImages();" background="%c9l%e9ments%20partag%e9s/background.gif">
<table border="0" cellspacing="0" cellpadding="0" align="center">
<tr align="center" height="19">
<td height="19"></td>
</tr>
<tr align="center">
<td>
<table width="770" border="0" cellspacing="0" cellpadding="0" background="%c9l%e9ments%20partag%e9s/Fond%20de%20page.jpg" cool gridx="16" gridy="16" height="530">
<tr height="21">
<td width="7" height="529" rowspan="12"></td>
<td width="6" height="154" colspan="2" rowspan="7"></td>
<td width="71" height="70" rowspan="3"></td>
<td width="189" height="67" colspan="2" rowspan="2"></td>
<td width="26" height="100" colspan="2" rowspan="5"></td>
<td width="470" height="21"></td>
<td width="1" height="21"><spacer type="block" width="1" height="21"></td>
</tr>
<tr height="46">
<td width="470" height="46" valign="top" align="left" xpos="299"><img src="PAGES/Index/Blabla%20Index.gif" alt="" width="427" height="46" border="0"></td>
<td width="1" height="46"><spacer type="block" width="1" height="46"></td>
</tr>
<tr height="3">
<td width="189" height="171" colspan="2" rowspan="8" valign="top" align="left" xpos="84"><a onmouseover="changeImages('Nico','Liens%20Menu/Nico%20-%20Roll%20over.gif');return true" onmouseout="changeImages('Nico','Liens%20Menu/Nico.gif');return true" href="Nico.html"><img id="Nico" src="Liens%20Menu/Nico.gif" alt="" name="Nico" width="115" height="160" border="0"></a></td>
<td width="470" height="33" rowspan="3"></td>
<td width="1" height="3"><spacer type="block" width="1" height="3"></td>
</tr>
<tr height="21">
<td width="71" height="21" valign="top" align="left" xpos="13"><img src="Liens%20Menu/Accueil%20-%20Selection.gif" alt="" width="54" height="20" border="0"></td>
<td width="1" height="21"><spacer type="block" width="1" height="21"></td>
</tr>
<tr height="9">
<td width="71" height="21" rowspan="2" valign="top" align="left" xpos="13"><a onmouseover="changeImages('Services','Liens%20Menu/Exp%e9rience%20-%20Roll%20over.gif');return true" onmouseout="changeImages('Services','Liens%20Menu/Exp%e9rience.gif');return true" href="Services.html"><img id="Services" src="Liens%20Menu/Exp%e9rience.gif" alt="" name="Services" width="54" height="20" border="0"></a></td>
<td width="1" height="9"><spacer type="block" width="1" height="9"></td>
</tr>
<tr height="12">
<td width="496" height="138" colspan="3" rowspan="5" valign="top" align="left" xpos="273"><img src="PAGES/Index/Plaquette%20Index.gif" alt="" width="475" height="114" border="0"></td>
<td width="1" height="12"><spacer type="block" width="1" height="12"></td>
</tr>
<tr height="42">
<td width="71" height="42" valign="top" align="left" xpos="13"><a onmouseover="changeImages('Tarifs','Liens%20Menu/Tarifs%20-%20Roll%20over.gif');return true" onmouseout="changeImages('Tarifs','Liens%20Menu/Tarifs.gif');return true" href="Tarifs.html"><img id="Tarifs" src="Liens%20Menu/Tarifs.gif" alt="" name="Tarifs" width="54" height="20" border="0"></a></td>
<td width="1" height="42"><spacer type="block" width="1" height="42"></td>
</tr>
<tr height="21">
<td width="77" height="21" colspan="3" valign="top" align="left" xpos="7"><a onmouseover="changeImages('Travaux','Liens%20Menu/R%e9alisations%20-%20Roll%20over.gif');return true" onmouseout="changeImages('Travaux','Liens%20Menu/R%e9alisations.gif');return true" href="R%e9alisations.html"><img id="Travaux" src="Liens%20Menu/R%e9alisations.gif" alt="" name="Travaux" width="69" height="20" border="0"></a></td>
<td width="1" height="21"><spacer type="block" width="1" height="21"></td>
</tr>
<tr height="21">
<td width="3" height="354" rowspan="4"></td>
<td width="74" height="21" colspan="2" valign="top" align="left" xpos="10"><a onmouseover="changeImages('Parcours','Liens%20Menu/Parcours%20-%20Roll%20over.gif');return true" onmouseout="changeImages('Parcours','Liens%20Menu/Parcours.gif');return true" href="Parcours.html"><img id="Parcours" src="Liens%20Menu/Parcours.gif" alt="" name="Parcours" width="65" height="20" border="0"></a></td>
<td width="1" height="21"><spacer type="block" width="1" height="21"></td>
</tr>
<tr height="42">
<td width="3" height="333" rowspan="3"></td>
<td width="71" height="42" valign="top" align="left" xpos="13"><a onmouseover="changeImages('Contact','Liens%20Menu/Contact%20-%20Roll%20over.gif');return true" onmouseout="changeImages('Contact','Liens%20Menu/Contact.gif');return true" href="Contact.html"><img id="Contact" src="Liens%20Menu/Contact.gif" alt="" name="Contact" width="54" height="20" border="0"></a></td>
<td width="1" height="42"><spacer type="block" width="1" height="42"></td>
</tr>
<tr height="258">
<td width="118" height="291" colspan="2" rowspan="2"></td>
<td width="142" height="258"></td>
<td width="5" height="291" rowspan="2"></td>
<td width="491" height="258" colspan="2" valign="top" align="left" xpos="278"><object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab" height="200" width="466">
<param name="cache" value="true">
<param name="dontflattenwhensaving" value="false">
<param name="autohref" value="false">
<param name="kioskmode" value="false">
<param name="enablejavascript" value="false">
<param name="autoplay" value="true">
<param name="controller" value="false">
<param name="src" value="Vid%e9os/Soleil-Index.mov">
<embed type="video/quicktime" height="200" width="466" autoplay="true" controller="false" src="Vid%e9os/Soleil-Index.mov" enablejavascript="false" kioskmode="false" autohref="false" dontflattenwhensaving="false" cache="true">
</object></td>
<td width="1" height="258"><spacer type="block" width="1" height="258"></td>
</tr>
<tr height="33">
<td width="142" height="33" valign="top" align="left" xpos="131"><img src="%c9l%e9ments%20partag%e9s/Date.gif" alt="" width="70" height="20" border="0"></td>
<td width="491" height="33" colspan="2"></td>
<td width="1" height="33"><spacer type="block" width="1" height="33"></td>
</tr>
<tr height="1" cntrlrow>
<td width="7" height="1"><spacer type="block" width="7" height="1"></td>
<td width="3" height="1"><spacer type="block" width="3" height="1"></td>
<td width="3" height="1"><spacer type="block" width="3" height="1"></td>
<td width="71" height="1"><spacer type="block" width="71" height="1"></td>
<td width="47" height="1"><spacer type="block" width="47" height="1"></td>
<td width="142" height="1"><spacer type="block" width="142" height="1"></td>
<td width="5" height="1"><spacer type="block" width="5" height="1"></td>
<td width="21" height="1"><spacer type="block" width="21" height="1"></td>
<td width="470" height="1"><spacer type="block" width="470" height="1"></td>
<td width="1" height="1"></td>
</tr>
</table>
</td>
</tr>
<tr align="center" height="19">
<td height="19"></td>
</tr>
<tr align="center">
<td>&copy; 2005 Nicolas David-Cavaz</td>
</tr>
</table>
<p></p>
</body>
</html>

Commentaire de a_carton le 12/04/2005 00:45:27

Ok ça marche...
Désolé pour l'encombrement, la solution à mon problème est que pour le moment, Mozilla Firefox (1.0.2) fait planter l'affichage !
Ça marche nickel avec IE de Microsoft.

Ce que j'en retiens : Si ça marche en local (preview Golive par ex.) mais plus en ligne, il faut tester tout de suite avec un autre Browser !!!

Commentaire de vanden le 17/08/2005 17:26:01

Bonjour,

je suis a la recherche d'un script de chargement pour un VRML (integré dans une page html). Je trouve des scripts de preload mais seulement pour des images ou des pages html. Auriez vous une astuce pour charger ce fichier (wrl)
Merci d'avance
vans

Commentaire de daftfunk le 14/09/2005 12:39:11

Salut a tous... quelqu'un naurais pas un script qui marche!!???

frank123>> finalement! ta bidouille elle marche?:

larsen44>> QQ1 a testé son code?

Commentaire de fadelovesky le 28/04/2008 03:27:10 10/10

salut
je viens de decouvrir ton code,bravo je met un 10

j'ai réussi à l'integrer dans mon site(www.fadelarchi.c.la) , ca marche nikel en local
Mais,Mais,.....Ce dernier ne marche pas (sauf erreur de ma part) dans les site hébergé dans multimania,car elle ajoute des scripts au début !!

pouvez vous m'aider?

cordiallemeny,fadelovesky

Qualification(webmaster Initié)

Commentaire de fadelovesky le 28/04/2008 03:32:52

Désolé^10

le problème était que le dossier "Preload" contenant les images de progressbar n'était pas dans le serveur.
Surement un oubli de ma part
mais bon confirmation,ca marche dans multimania
encore merci et bravo pour le script,dommage qu'on peut pas voter 2 fois !

fadelovesky

Commentaire de xfamousx le 13/05/2008 23:10:31

bonsoir !

bon moi je vous previens je suis un vrai débutant ...
j'ai creé une page free avec une image et un lien vers mon vrai site .
le probleme c'est que cette image met disons 15-30sec a s'afficher ... donc j'aurais aimer mettre ce script avant cette page...
j'utilise free.fr et je sais pas comment mettre de script dans free... je sais juste inserer des pages word ou autre =s
donc si vous pouviez me dire comment mettre cette super barre de progresion sur un fond noir (de preference) avant ma page d'acceuil je serai comblé :)
mon site pour vous rendre compte : http://lavancelle.free.fr
merci d'avance !

Commentaire de DevilTN le 11/11/2008 11:49:04

slt
c'est un tres bonne code BRAVO :)
j'essaie maintenant de le modifie pour le rendre progresse bar :
function preloadImage(i,j){...}
function balbla()
{
for(var i=0;i<1000;i++)
   {
   preloadImage(i,1000);
   ....
   }
}
=>le i n'incrémente pas dans le fonction preloadImage et elle n'est plus un variable globale,
aussi setTimeout(preloadImage) devient plus utile
je pense que se doit marche mais j'ai pas encore teste
merci ton code est bien commente    

Commentaire de MahudV le 20/03/2009 23:09:26 10/10

Parfait aussi bien sur IE que sur Mozilla... Merci
Juste une légère correction pour améliorer la mise en page...
Tu as écris <TD align=middle bgColor=#ffffff>
A remplacer par  <TD valign=middle align=center bgColor=#ffffff>

Commentaire de camyphil le 16/06/2009 10:09:23 10/10

super script!!! bravo

 Ajouter un commentaire




Nos sponsors


Sondage...

Comparez les prix

CalendriCode

Février 2012
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
272829    

Consulter la suite du CalendriCode

Photothèque

 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 1,810 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales