Conflit entre deux js dans une page HTML (inclure plusieurs js)

Conflit entre deux js dans une page HTML (inclure plusieurs js) - HTML/CSS - Programmation

Marsh Posté le 28-06-2007 à 13:00:44    


Bonjour,  
 
Je débute en javascript et j'ai présentement un problème dont je n'arrive pas à trouver la solution... Ca fait déjà un bon moment que j'essais un peu toutes les solutions que je trouve sur différents forum et je n'y arrive pas... Alors voilà je m'explique.  
 
J'ai deux fichiers (js) contenants du code JS (ça va de soit :p ) Les deux codes fonctionnent séparément dans une page html, mais lorsque j'appel les deux fichiers js dans ma page html, c'est soit l'un ou soit l'autre qui marche...  
 
Voici comment j'appel mes js dans ma page html:  
 
<script type="text/javascript" src="js/zoom.js"></script>
<script type="text/javascript" src="js/menu_utram.js"></script>
 
et ce entre les balises <head></head>.  
 
Voici maintenant le code de mes js:  
 
 
menu_utram.js:
 
 
var object = new Array();
 
  function Slide(N,oCont){
  this.N  = N;
<!-- arrivée du menu par le haut-->  
  this.S  = -1.1;
<!-- arrivée du menu par le haut-->
  this.object = new Array();
  this.CObj = function (parent,N){
  this.parent = parent;
  this.N = N;
  this.obj = parent.frm[N];
  this.tit = this.obj.firstChild;
  this.div = this.obj.getElementsByTagName("div" )[1];
  this.div.style.visibility = "hidden";
<!--espacement des section du menu à l'arrivée-->  
  this.y0 = N * 18;
<!--espacement des section du menu à l'arrivée-->    
  this.Y1 = this.y0;
  this.obj.style.top = this.y0;
  this.obj.style.height = parent.H - (parent.NF) * 18-0;
  this.obj.style.visibility = "visible";
  this.obj.parent = this;
  this.run = false;
  this.move = function(){
  with(this){
  dy = (y1-y0)/parent.S;
<!--.1 pour espace en bas de plan du site-->    
  if(Math.abs(dy)>.1){
<!--.1 pour espace en bas de plan du site-->        
  y0+=dy;
  obj.style.top = Math.round(y0);
  setTimeout("object["+parent.N+"].object["+N+"].move();", 16);
  } else {
  run = false;
  if(dy>0)div.style.visibility="hidden";
  else if(N>0)parent.object[N-1].div.style.visibility="hidden";
  }
  }
  }
 
  this.obj.onmouseover = function(){
  with(this.parent){
  if(!run){
  run = true;
  div.style.visibility="visible";
 
  for(i=0;i<=N;i++){
 
  parent.object[i].y1 = i*18;
  parent.object[i].move();
  }
  for(i=N+1;i<parent.NF;i++){
  parent.object[i].y1 = parent.H-(parent.NF-i)*18;
  parent.object[i].move();
       
     }
    }
   }
  }
 }
 
 this.frm = document.getElementById(oCont);
 this.H = parseInt(this.frm.style.height);
 this.frm = this.frm.getElementsByTagName("span" );
 this.NF = this.frm.length;
 for(i=0;i<this.NF;i++) this.object[i] = new this.CObj(this, i);
 
 
<!--position des sections-->    
 this.object[0].obj.onmouseover();
<!--position des sections-->    
 
<!--vitesse d'apparition du menu-->      
 this.S = 5;
<!--vitesse d'apparition du menu-->      
}
 
window.onload = function(){object[0] = new Slide(0, "frames" );
preload();
}
 
//-->
<!-- fin java menu karine-->
 
 
zoom.js:
 
 
 
 
var ym=0;
var my=0;
 
createElement = function(container, type, param){
 o=document.createElement(type);
 for(var j in param)o[j]=param[j];
 container.appendChild(o);
 return o;
}
 
mooz = {
 O:[],
 /////////
 mult:6,
 nbI:5,
 /////////
 rwh:0,
 imgsrc:0,
 W:0,
 B:0,
 
 Xoom:function(M){
  this.o = createElement(document.getElementById("zoom" ), "spane", {
   'className':'spaneslides'
  });
  img = createElement(this.o, "img", {
   'className':"imgslides",
   'src':mooz.imgsrc[M%mooz.imgsrc.length].src
  });
  spa = createElement(this.o, "spane", {
   'className':"imgslides"
  });
  txt = createElement(spa, "spane", {
   'className':"txtslides",
   'innerHTML':mooz.imgsrc[M%mooz.imgsrc.length].title
  });
  this.M = 10000+M;
 },
 
 mainloop:function(){
  with(this){
   for(j=0; j<mooz.nbI; j++) {
    O[j].M += (ym-my)/8000;
    M = O[j].M%nbI;
    ti = Math.pow(mult,M);
    with(O[j].o.style){
     left   = Math.round((W-(ti*rwh))/(W+ti)*(W*.5))+"px";
     top    = Math.round((B-ti)/(B+ti)*(B*.5))+"px";
     zIndex = Math.round(10000-ti*.1);
     width  = Math.round(ti*rwh)+"px";
     height = Math.round(ti)+"px";
    }
   }
  }
  setTimeout("mooz.mainloop();", 16);
 },
 
 oigres:function(){
  with(this){
   W = parseInt(document.getElementById("zoom" ).style.width);
   B = parseInt(document.getElementById("zoom" ).style.height);
   imgsrc = document.getElementById("images" ).getElementsByTagName("img" );
   rwh = imgsrc[0].width/imgsrc[0].height;
   for(var j=0;j<nbI;j++) O[j] = new Xoom(j);
   mainloop();
  }
 }
}
 
document.onmousemove = function(e){
 if(window.event) e=window.event;
 ym = (e.y || e.clientY);
 if(ym/2>my)my=ym/2;
}
 
window.onload = function(){
 ym = my+50;
 mooz.oigres();
 preload();
}
 
Quelqu'un peut-il m'aider svp... Je commence à perdre patience là  :pt1cable:
 
 
 

Reply

Marsh Posté le 28-06-2007 à 13:00:44   

Reply

Marsh Posté le 28-06-2007 à 13:11:44    

Salut,  
 
Edite ton message et mets ton code entre les balises [cpp][/cpp]. C'est illisible. Merci.


---------------
"Nous avons tous nos machines du temps. Celles qui nous ramènent en arrière sont les souvenirs, celles qui nous projettent en avant sont les rêves."
Reply

Marsh Posté le 28-06-2007 à 13:22:29    

Et qu'est ce qui marche pas surtout?
T'as une erreur js? ou rien qui se passe?

Reply

Marsh Posté le 28-06-2007 à 14:21:40    

Code :
  1. Bonjour,  
  2.  
  3. Je débute en javascript et j'ai présentement un problème dont je n'arrive pas à trouver la solution... Ca fait déjà un bon moment que j'essais un peu toutes les solutions que je trouve sur différents forum et je n'y arrive pas... Alors voilà je m'explique.  
  4.  
  5. J'ai deux fichiers (js) contenants du code JS (ça va de soit :p ) Les deux codes fonctionnent séparément dans une page html, mais lorsque j'appel les deux fichiers js dans ma page html, c'est soit l'un ou soit l'autre qui marche...  
  6.  
  7. Voici comment j'appel mes js dans ma page html:  
  8.  
  9. <script type="text/javascript" src="js/zoom.js"></script>
  10. <script type="text/javascript" src="js/menu_utram.js"></script>
  11.  
  12. et ce entre les balises <head></head>.  
  13.  
  14. Voici maintenant le code de mes js:  
  15.  
  16.  
  17. menu_utram.js:
  18.  
  19.  
  20. var object = new Array();
  21.  
  22.   function Slide(N,oCont){
  23.   this.N  = N;
  24. <!-- arrivée du menu par le haut-->  
  25.   this.S  = -1.1;
  26. <!-- arrivée du menu par le haut-->
  27.   this.object = new Array();
  28.   this.CObj = function (parent,N){
  29.   this.parent = parent;
  30.   this.N = N;
  31.   this.obj = parent.frm[N];
  32.   this.tit = this.obj.firstChild;
  33.   this.div = this.obj.getElementsByTagName("div" )[1];
  34.   this.div.style.visibility = "hidden";
  35. <!--espacement des section du menu à l'arrivée-->  
  36.   this.y0 = N * 18;
  37. <!--espacement des section du menu à l'arrivée-->    
  38.   this.Y1 = this.y0;
  39.   this.obj.style.top = this.y0;
  40.   this.obj.style.height = parent.H - (parent.NF) * 18-0;
  41.   this.obj.style.visibility = "visible";
  42.   this.obj.parent = this;
  43.   this.run = false;
  44.   this.move = function(){
  45.   with(this){
  46.   dy = (y1-y0)/parent.S;
  47. <!--.1 pour espace en bas de plan du site-->    
  48.   if(Math.abs(dy)>.1){
  49. <!--.1 pour espace en bas de plan du site-->        
  50.   y0+=dy;
  51.   obj.style.top = Math.round(y0);
  52.   setTimeout("object["+parent.N+"].object["+N+"].move();", 16);
  53.   } else {
  54.   run = false;
  55.   if(dy>0)div.style.visibility="hidden";
  56.   else if(N>0)parent.object[N-1].div.style.visibility="hidden";
  57.   }
  58.   }
  59.   }
  60.  
  61.   this.obj.onmouseover = function(){
  62.   with(this.parent){
  63.   if(!run){
  64.   run = true;
  65.   div.style.visibility="visible";
  66.  
  67.   for(i=0;i<=N;i++){
  68.  
  69.   parent.object[i].y1 = i*18;
  70.   parent.object[i].move();
  71.   }
  72.   for(i=N+1;i<parent.NF;i++){
  73.   parent.object[i].y1 = parent.H-(parent.NF-i)*18;
  74.   parent.object[i].move();
  75.        
  76.      }
  77.     }
  78.    }
  79.   }
  80.  }
  81.  
  82.  this.frm = document.getElementById(oCont);
  83.  this.H = parseInt(this.frm.style.height);
  84.  this.frm = this.frm.getElementsByTagName("span" );
  85.  this.NF = this.frm.length;
  86.  for(i=0;i<this.NF;i++) this.object[i] = new this.CObj(this, i);
  87.  
  88.  
  89. <!--position des sections-->    
  90.  this.object[0].obj.onmouseover();
  91. <!--position des sections-->    
  92.  
  93. <!--vitesse d'apparition du menu-->      
  94.  this.S = 5;
  95. <!--vitesse d'apparition du menu-->      
  96. }
  97.  
  98. window.onload = function(){object[0] = new Slide(0, "frames" );
  99. preload();
  100. }
  101.  
  102. //-->
  103. <!-- fin java menu karine-->
  104.  
  105.  
  106. zoom.js:
  107.  
  108.  
  109.  
  110.  
  111. var ym=0;
  112. var my=0;
  113.  
  114. createElement = function(container, type, param){
  115.  o=document.createElement(type);
  116.  for(var j in param)o[j]=param[j];
  117.  container.appendChild(o);
  118.  return o;
  119. }
  120.  
  121. mooz = {
  122.  O:[],
  123.  /////////
  124.  mult:6,
  125.  nbI:5,
  126.  /////////
  127.  rwh:0,
  128.  imgsrc:0,
  129.  W:0,
  130.  B:0,
  131.  
  132.  Xoom:function(M){
  133.   this.o = createElement(document.getElementById("zoom" ), "spane", {
  134.    'className':'spaneslides'
  135.   });
  136.   img = createElement(this.o, "img", {
  137.    'className':"imgslides",
  138.    'src':mooz.imgsrc[M%mooz.imgsrc.length].src
  139.   });
  140.   spa = createElement(this.o, "spane", {
  141.    'className':"imgslides"
  142.   });
  143.   txt = createElement(spa, "spane", {
  144.    'className':"txtslides",
  145.    'innerHTML':mooz.imgsrc[M%mooz.imgsrc.length].title
  146.   });
  147.   this.M = 10000+M;
  148.  },
  149.  
  150.  mainloop:function(){
  151.   with(this){
  152.    for(j=0; j<mooz.nbI; j++) {
  153.     O[j].M += (ym-my)/8000;
  154.     M = O[j].M%nbI;
  155.     ti = Math.pow(mult,M);
  156.     with(O[j].o.style){
  157.      left   = Math.round((W-(ti*rwh))/(W+ti)*(W*.5))+"px";
  158.      top    = Math.round((B-ti)/(B+ti)*(B*.5))+"px";
  159.      zIndex = Math.round(10000-ti*.1);
  160.      width  = Math.round(ti*rwh)+"px";
  161.      height = Math.round(ti)+"px";
  162.     }
  163.    }
  164.   }
  165.   setTimeout("mooz.mainloop();", 16);
  166.  },
  167.  
  168.  oigres:function(){
  169.   with(this){
  170.    W = parseInt(document.getElementById("zoom" ).style.width);
  171.    B = parseInt(document.getElementById("zoom" ).style.height);
  172.    imgsrc = document.getElementById("images" ).getElementsByTagName("img" );
  173.    rwh = imgsrc[0].width/imgsrc[0].height;
  174.    for(var j=0;j<nbI;j++) O[j] = new Xoom(j);
  175.    mainloop();
  176.   }
  177.  }
  178. }
  179.  
  180. document.onmousemove = function(e){
  181.  if(window.event) e=window.event;
  182.  ym = (e.y || e.clientY);
  183.  if(ym/2>my)my=ym/2;
  184. }
  185.  
  186. window.onload = function(){
  187.  ym = my+50;
  188.  mooz.oigres();
  189.  preload();
  190. }
  191.  
  192. Quelqu'un peut-il m'aider svp... Je commence à perdre patience là  :pt1cable:


 
En fait ce qui ne marche pas:  
 
Ben si je mets le premier appel de fonction en premier entre les balises <head> </head> c'est le premier trucs qui s'affiche et vice versa. Les deux en même temps ne s'affichent pas...[/code]

Reply

Marsh Posté le 28-06-2007 à 16:37:37    

Pour les intéressés, il suffisait de mettre des fonctions en fin de js:  
 
par exemple à la fin du menu:  
 
au lieu de cela:  
 
window.onload = function(){object[0] = new Slide(0, "frames" );
 
}
 
mettre cela:  
 
function initMenu()
{
object[0] = new Slide(0, "frames" );
}
 
et dans le zoom:  
 
au lieu de cela:
 
window.onload = function(){
 ym = my+50;
 mooz.oigres();
 
}
 
mettre cela:  
 
function initZoom()
{
ym = my+50;
mooz.oigres();
 }
 
 
et dans la page html il fallait mettre mes appels de fuction dans body comme ceci:  
 
<body onload="initMenu();initZoom()">
 

Reply

Sujets relatifs:

Leave a Replay

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