une question pour les informaticiens!

Informatique et nouvelles technologies...

Modérateur : Modérateurs

Répondre
Avatar de l’utilisateur
cyrille
Messages : 835
Inscription : 26/11/2006 - 20:06:00
Localisation : Bordeaux

Message par cyrille » 22/03/2007 - 22:25:23

arf, hum a ta place je poserais la question sur foum hardware.fr ou "le site du zero" qui est un tres bon site
Haut
Avatar de l’utilisateur
Xelz
Messages : 160
Inscription : 03/06/2006 - 13:46:48
Localisation : La Ciotat

Message par Xelz » 22/03/2007 - 23:17:28

Avec une balise map je ne pense pas que cela soit possible...
Sinon le plus simple tu fais des div à la position et taille que tu veux qui vont afficher un autre div avec ton image...
Haut
Avatar de l’utilisateur
Xelz
Messages : 160
Inscription : 03/06/2006 - 13:46:48
Localisation : La Ciotat

Message par Xelz » 23/03/2007 - 1:26:35

Un petit exemple (très vite fait) :

Code : Tout sélectionner

<html>
<head>
<script type="text/javascript">
function ajouter_point(x,y,image_affiche)
{
  refid="X"+x+"Y"+y;
  x=x-8;
  y=y-8;
  document.getElementById("ma_carte").innerHTML+="<div id=\"PT"+refid+"\" STYLE=\"visibility:visible; position:absolute; top:"+y+"px; left:"+x+"px\" onMouseOver=\"document.getElementById('IM"+refid+"').style.visibility='visible'\" onMouseOut=\"document.getElementById('IM"+refid+"').style.visibility='hidden'\"><img src=\"pt.gif\"></div>";
  x=x+16;
  y=y+16;
  document.getElementById("ma_carte").innerHTML+="<div id=\"IM"+refid+"\" STYLE=\"visibility:hidden; position:absolute; top:"+y+"px; left:"+x+"px\"><img src=\""+image_affiche+"\"></div>";
}
</script>
</head>
<body>
<div id="ma_carte" STYLE="visibility:visible; position:absolute; top:150; left:0"><IMG SRC="carte.gif" border=0></div>
<script type="text/javascript">
ajouter_point(256,256,'tresor1.jpg');
ajouter_point(100,50,'tresor2.jpg');
ajouter_point(100,200,'tresor3.jpg');
</script>
</body>
</html>


Les images à ajouter :
carte.gif --> une image quelconque d'environ 500x500px
pt.gif --> une image pour noter les points de 16x16px
tresor1.jpg, tresor2.jpg, tresor3.jpg --> des images quelconques

Pour chaque point que tu veux ajouter, il suffit de rajouter une ligne ajouter_point(x,y,<nom de l'image>)

Je n'ai pas vérifié si tout est correct dans le code, mais cela marche sur firefox 1.5
Haut
Répondre

Revenir à « Numérique »