Ecco il codice del "mappatore":
<html><head>
</head>
<body>
<img id="immagine" src="italia.jpg" style="position: absolute; left: 100px; top: 10px; border: 2px solid black;">
<div id="legenda" style="position:absolute;left:100px;top:550px;width:1000px;height:150px;border:5px solid blue"></div>
<script>
function clicca(event){
var StyleLeft=this.style.left;
var StyleTop=this.style.top;
document.getElementById("legenda").innerHTML+=(event.clientX-Number(StyleLeft.replace("px","")))+", "+(event.clientY-Number(StyleTop.replace("px","")))+", ";
}
document.getElementById("immagine").onclick=clicca;
</script>
</body></html>
In esso ho inserito un'immagine chiamata italia.jpg.Ecco la pagina.
(l'immagine è presa da questo sito. Nel caso ci siano problemi di copyright la rimuoverò immediatamente, ovvio!) Dovrei superare la limitazione del dover manipolare il codice HTML della pagina per inserire l'immagine...
Nessun commento:
Posta un commento