par
Axel » 14 juil. 2005, 19:40
Salut
voilà en trés gros le code, si tu t'informes un peu sur le javascript je pense que tu peux y arriver
tout d'abord il faut que tu mettes ton image d'installation (Attention à l'attribut usemap qui est important tu le verra avec la suite,; il correspond au nom de la balise map plus bas)
avec des zones définies sur chaque équipement
(qui sont en fait des zones clickables avec des coordonnées) [les chiffres de coordonnees marchent par 2: x1,y1,x2,y2 ]
tu remarqueras la fonction aff_coord() qui servira pour permettre l'affichage des coordonnées au survol de la souris.
Code : Tout sélectionner
<map name="carte">
<area shape="rect" coords="0,0,39,28" href="#" onmouseover="javascript: aff_coord('echangeur');">
<area shape="rect" coords="48,0,84,28" href="#" onmouseover="javascript: aff_coord('echangeur');">
</map>
enfin il te faut définir un calque:
et pour finir la fonction aff_coord et le tableau qu'il faudrait mettre en haut de page.
<script language="JavaScript" type="text/javascript">
<!--
equipements = new Array();
equipements[0]= new Array('echangeur', x1, y1);
equipements[0]= new Array('compresseur', x2, y2);
function aff_coord( equipement ) {
//faire une boucle sur la variable tableau crée pour trouver l'id de l'équipement
// tu peux faire ça tout seul en javascript c'est presque identique au php
//faire afficher le nom et les coordonnées dans le div
document.getElementById('coord').innerHTML = "nom :" + equipements[IDtrouvé][0] +"<br/> coord = "+ equipements[IDtrouvé][1] +" , "+equipements[IDtrouvé][2];
}
// -->
</script>
Salut
voilà en trés gros le code, si tu t'informes un peu sur le javascript je pense que tu peux y arriver :lol:
tout d'abord il faut que tu mettes ton image d'installation (Attention à l'attribut usemap qui est important tu le verra avec la suite,; il correspond au nom de la balise map plus bas)
[code]<img src="installation.gif" usemap="#carte">[/code]
avec des zones définies sur chaque équipement
(qui sont en fait des zones clickables avec des coordonnées) [les chiffres de coordonnees marchent par 2: x1,y1,x2,y2 ]
tu remarqueras la fonction aff_coord() qui servira pour permettre l'affichage des coordonnées au survol de la souris.
[code]<map name="carte">
<area shape="rect" coords="0,0,39,28" href="#" onmouseover="javascript: aff_coord('echangeur');">
<area shape="rect" coords="48,0,84,28" href="#" onmouseover="javascript: aff_coord('echangeur');">
</map>[/code]
enfin il te faut définir un calque:
[code]<div name="coord" id="coord"></div>[/code]
et pour finir la fonction aff_coord et le tableau qu'il faudrait mettre en haut de page.
[php]<script language="JavaScript" type="text/javascript">
<!--
equipements = new Array();
equipements[0]= new Array('echangeur', x1, y1);
equipements[0]= new Array('compresseur', x2, y2);
function aff_coord( equipement ) {
//faire une boucle sur la variable tableau crée pour trouver l'id de l'équipement
// tu peux faire ça tout seul en javascript c'est presque identique au php
//faire afficher le nom et les coordonnées dans le div
document.getElementById('coord').innerHTML = "nom :" + equipements[IDtrouvé][0] +"<br/> coord = "+ equipements[IDtrouvé][1] +" , "+equipements[IDtrouvé][2];
}
// -->
</script>
[/php]