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


 
 
fichier preload.js:
 

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