Visor
de panorámicas.
Código fuente
<script>
/********************************************************************
 Visor de panorámicas en 360º. Por Carlitos. carlosbernad@teleline.es
 Si usas este script, deja intactas estas líneas (créditos). Vale?
 También te agradecería un e-mail con tus comentarios. (carlosbernad@teleline.es)
 Visor de panorámicas en 360º v.1 En fase de experimentación.
********************************************************************/
pausa = 20
imagen = new Image()
imagen.src = "img.jpg"

var anima
function inicio()
{
document.getElementById('img1').width = imagen.width
document.getElementById('img1').height = imagen.height
document.getElementById('img2').width = imagen.width
document.getElementById('img2').height = imagen.height
document.getElementById('img1').src = imagen.src
document.getElementById('img2').src = document.getElementById('img1').src
anci = imagen.width
alti = imagen.height
document.getElementById("contenido2").style.left = -anci
limit = document.getElementById('limites').style
curs = document.getElementById('cursor').style
limit.height = alti
limit.width = alti
limit.top = (document.body.clientHeight - alti)/2
limit.left = (screen.width - alti)/2
curs.top = ((document.body.clientHeight - alti)/2) - 30
curs.left = (screen.width - alti)/2 + ((alti/2) - 35)
clipi = 'rect(0px ' + alti + ' ' + alti + ' 0px)'
limit.clip = clipi
}
function mueve(pix)
{
px=pix
pixel=parseInt(document.getElementById("contenido").style.left);
pixel2=parseInt(document.getElementById("contenido2").style.left);

if (pixel == 0)
{
pixel2 = -anci
}
if (pixel2 == 0)
{
pixel = -anci
}
if (pixel == -(anci-alti))
{
pixel2 = alti
}
if (pixel2 == -(anci-alti))
{
pixel = alti
}
 
document.getElementById("contenido").style.left = pixel + px
document.getElementById("contenido2").style.left = pixel2 + px
anima = setTimeout("mueve(px)",pausa)
  
}
function para()
{
clearTimeout(anima)
}
</script>
<body onload="inicio()">
<p>Visor de panorámicas.</p>
<div id="cursor" style="position:absolute; left: 200px; top: 240px"> 
<input type="button" value="<<<" onmouseover="mueve(1)" onmouseout="para()">
<input type="button" value=">>>" onmouseover="mueve(-1)"  onmouseout="para()">

</div>
<div id="limites" style="position:absolute;">

<div id="contenido" style="position:absolute; left:0px; top:0px;z-index:1">

<img id="img1">

</div>
<div id="contenido2" style="position:absolute;  z-index:1">
 
<img id="img2">

</div>

</div>

</body>