11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Pour ouvrir une image dans une popup, j'utilise la fonction javascript suivante :
function AfficherImage(img){
  Image1= new Image();
  Image1.src=(img);
  Control(img);
}
function Control(img){
  if((Image1.width!=0)&&(Image1.height!=0)){
    VoirImage(img);
  }
  else{
    fonction="Control('"+img+"')";
    intervalle=setTimeout(fonction,20);
  }
}


function VoirImage(img){

  var titre=img;
  var k=titre.lastIndexOf('/',titre.length-1);
  titre=titre.substring(k+1);


  win=window.open(img,"","left=10,top=10,scrollbars=no");
     if(win)
   {
    win.resizeTo(Image1.width+30,Image1.height+50);
    }

win.document.write("<HTML><HEAD><TITLE>"+titre+"</TITLE></HEAD>");
win.document.write("<BODY onblur='window.close()' onclick='window.close()' >");
win.document.write("<IMG src='"+img+"' border=0 alt='Cliquez sur l'image pour fermer'>");

win.document.write("</BODY></HTML>");

}


et je l'appelle dans la partie html comme ça :
<a href="javascript:AfficherImage('agran.JPG');">
               <img src="../images/photos/agrandissement/agran.JPG" alt="cliquez pour agrandir" width="200" height="100" /></a></li></td>


Sa marche très bien, mais seulement quant l'image à afficher et dans le même répertoire.
Pouvez vous m'aider svp, à modifier cette fonction pour qu'une image qui se trouve dans autre répertoire s'ouvre dans une popup,(../images/photos/mon_image.jpg).
Je pense que je doit utiliser la fonction getElementById(), mais après de nombreux essais, je n'y arrive pas, peut-être problème de synthaxe...

Aidez moi svp,
Merci d'avance.
t es sur? je viens de tester ton code chez moi avec ie6, firefox et ca marche. seule chose avec firefox la popup affiche arrété dans la barre dessous. mais l'image etait visible.

seule chose que j'ai fait pour arranger l'affichage:

dans la partie html bien mettre le chemin aussi a l'appel de fonction

<a href="javascript:AfficherImage('../images/photos/agrandissement/agran.JPG');">
<img src="../images/photos/agrandissement/agran.JPG" alt="cliquez pour agrandir" width="200" height="100" /></a></li></td>
Oui, ça fonctionne si on met

<a href="javascript:AfficherImage('../images/photos/agrandissement/agran.JPG');">
<img src="../images/photos/agrandissement/agran.JPG" alt="cliquez pour agrandir" width="200" height="100" /></a></li></td>

mais dans ce cas, le popup ne s'adapte pas aux dimensions de l'image...

Ne dois-je pas utiliser la fonction getElementById() dans le javascript, pour avoir le chemin de l'image ?