Ciao, ho messo una immagine in un DIV. L'immagine è più grande del DIV che la contiene e quindi dovrei scorrerla per visualizzarne le varie parti. Sto cercando un sistema per scorrerla senza usare gli scrollbar ma spostando semplicemente la mappa (per intenderci l'effetto di Google Maps).
Come posso fare?
usa questo
copialo brutalmente in cima alla tua pagina HTML
<style>
.dragme{position:relative;}
</style>
<script language="JavaScript1.2">
var ie=document.all;
var nn6=document.getElementById&&!document.all;
var isdrag=false;
var x,y;
var dobj;
function movemouse(e)
{
if (isdrag)
{
dobj.style.left = nn6 ? tx + e.clientX - x : tx + event.clientX - x;
dobj.style.top = nn6 ? ty + e.clientY - y : ty + event.clientY - y;
return false;
}
}
function selectmouse(e)
{
var fobj = nn6 ? e.target : event.srcElement;
var topelement = nn6 ? "HTML" : "BODY";
while (fobj.tagName != topelement && fobj.className != "dragme")
{
fobj = nn6 ? fobj.parentNode : fobj.parentElement;
}
if (fobj.className=="dragme")
{
isdrag = true;
dobj = fobj;
tx = parseInt(dobj.style.left+0);
ty = parseInt(dobj.style.top+0);
x = nn6 ? e.clientX : event.clientX;
y = nn6 ? e.clientY : event.clientY;
document.onmousemove=movemouse;
return false;
}
}
document.onmousedown=selectmouse;
document.onmouseup=new Function("isdrag=false")
</script>
manca un pezzo
<div id="Layer1" style="position:absolute; width:200px; height:115px; z-index:1; left: 0px; top: 0px">
<img src="tuaimmagine.jpg" class="dragme">
</div>