[Résolu] Conflit entre deux fichiers js (plusieurs onLoad)

Conflit entre deux fichiers js (plusieurs onLoad) [Résolu] - HTML/CSS - Programmation

Marsh Posté le 11-05-2007 à 11:09:24    

Bonjour, j'ai un petit soucis avec la cohabitation de 2 fichiers js comprenant chacun un "onLoad"
 
Je fais appel dans une popup à deux fichiers js stockés dans un dossier "scripts" à la racine du site:
 

Code :
  1. <script type="text/javascript" src="scripts/script_galerie.js"></script>
  2. <script type="text/javascript" src="scripts/preload.js"></script>


 
fichier script_galerie.js:
 

Code :
  1. function displayPics()
  2. {
  3. var photos = document.getElementById('galerie_mini') ;
  4. // On récupère l'élément ayant pour id galerie_mini
  6. var liens = photos.getElementsByTagName('a') ;
  7. // On récupère dans une variable tous les liens contenu dans galerie_mini
  9. var big_photo = document.getElementById('big_pict') ;
  10. // Ici c'est l'élément ayant pour id big_pict qui est récupéré, c'est notre photo en taille normale
  12. // Une boucle parcourant l'ensemble des liens contenu dans galerie_mini
  13. for (var i = 0 ; i < liens.length ; ++i) {
  14.  // Au clic sur ces liens  
  15.  liens[i].onclick = function() {
  16.   big_photo.src = this.href; // On change l'attribut src de l'image en le remplaçant par la valeur du lien
  17.   big_photo.alt = this.title; // On change son titre
  18.   return false; // Et pour finir on inhibe l'action réelle du lien
  19.  };
  20. }
  21. }
  22. window.onload = displayPics;


 
 
fichier preload.js:
 

Code :
  1. var speed = 10;
  2. var transition = 10;
  4. // Dimensions du preloader en GIF animé
  5. var GIFpreloadLargeur = 32;
  6. var GIFpreloadHauteur = 32;
  8. var timer= 0;
  9. var opaciT = 100;
  11. function opacity()
  12. {
  13.     opaciT = opaciT - transition;
  15.     var object = document.getElementById('preloader').style;
  16.     object.opacity = (opaciT / 100);
  17.     object.MozOpacity = (opaciT / 100);
  18.     object.KhtmlOpacity = (opaciT / 100);
  19.     object.filter = "alpha(opacity=" + opaciT + " )";
  20.      
  21.         if (opaciT <= 0)
  22.         {
  23.                 document.getElementById('preloader').style.visibility='hidden';
  24.                 clearInterval(timer);
  25.         }
  27. }
  29. function preload()
  30. {
  31.         if (document.getElementById)
  32.         {
  33.                 document.getElementById('preloadIMG').style.visibility='hidden';
  34.                 timer = setInterval("opacity()",speed);
  35.         }
  36.      
  37.         else
  38.         {
  39.                 if (document.layers)
  40.                 {     
  41.                         document.preloadIMG.visibility = 'hidden';
  42.                         timer = setInterval("opacity()",speed);
  43.             }
  44.                 else
  45.                 {
  46.                         document.all.preloadIMG.style.visibility = 'hidden';
  47.                         timer = setInterval("opacity()",speed);
  48.                 }
  49.         }
  50. }
  52. // GÉNÉRER LE CSS POUR LE PRELOADER
  53. var myCSS;
  54. myCSS = "<style type=\"text/css\">";
  56. myCSS += "html, body { height:auto; margin:0px; padding:0px;}";
  58. myCSS += "#preloader {";
  59. myCSS += "position:fixed;";
  60. myCSS += "background-color:white;";
  61. myCSS += "width:100%;";
  62. myCSS += "height:100%; ";
  63. myCSS += "display:block;";
  64. myCSS += "z-index:100000;";
  65. myCSS += "}";
  67. myCSS += "#preloadIMG {";
  68. myCSS += "position:absolute;";
  69. myCSS += "left:50%;";
  70. myCSS += "width:" + GIFpreloadLargeur + "px;";
  71. myCSS += "height:" + GIFpreloadHauteur + "px;";
  72. myCSS += "margin-left:-" + (GIFpreloadLargeur / 2) + "px;";
  73. myCSS += "top:150px;";
  74. myCSS += "}";
  76. myCSS += "</style>";
  78. // ÉCRITURE DES CSS
  79. window.document.write(myCSS);
  81. // ÉXÉCUTION
  82. window.onload = function() { preload(); }


 
 
Le preload fonctionne très bien, mais du coup c'est le script de la galerie qui a un soucis, les photos s'affichent dans une nouvelle page au lieu de s'afficher dans la même page.
 
J'ai lu sur d'autres forums que le problème pouvait venir de la cohabitation de 2 "onLoad", mais je ne sais pas comment le résoudre.
 
Merci par avance pour votre aide.


Message édité par Ben-o le 11-05-2007 à 11:29:13
Reply

Marsh Posté le 11-05-2007 à 11:09:24   

Reply

Marsh Posté le 11-05-2007 à 11:23:47    

tu fais window.onload = function(){preload(); displayPics();}

Reply

Marsh Posté le 11-05-2007 à 11:25:57    

Merci Flo, je teste

Reply

Marsh Posté le 11-05-2007 à 11:28:52    

Ca fonctionne! Merci beaucoup

Reply

Marsh Posté le 11-05-2007 à 15:26:04    

Idéalement, tu devrais plutôt :
remplacer window.onload = function() { preload(); } par :

Code :
  1. if(document.addEventListener) document.addEventListener('load', preload, false);
  2. else document.attachEvent('onload', preload);


et remplacer window.onload = displayPics; par :

Code :
  1. if(document.addEventListener) document.addEventListener('load', displayPics, false);
  2. else document.attachEvent('onload', displayPics);
 

Quand tu rajoutera des scripts, ça t'évitera de retoucher à ton onload et si t'as un autre script qui touche à la propriété onload, ça évitera de faire merder les autres scripts.


Message édité par MacIntoc le 11-05-2007 à 16:14:40
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed