Hola de nuevo y gracias por atenderme
Mira esta es la direccion del mapa en cuestion
http://webs.ono.com/usr028/turiscan/planosan.htm
como veras al pinchar en cualquier zona del mapa se abre un pop-up de ese recuadro en el pop-up abajo hay dos enlaces que te llevan a ADELANTE -ATRAS yo lo que deseo es poner unas flechas en cada fotografia ( pop-up ) que estarian ARRIBA-ABAJO-IZQUIERDA-DERECHA que al pulsarlas me llevasen al pop-up que indicase y se mantuviese siempre dos pop-up en pantalla
resumiendo:
si pulso C7 saldra un pop-up al pulsar la flecha de la derecha ( enlace ) saldra C8 al mismo tiempo que se mantiene en pantalla el C7 al seguir pulsando en el C8 a la derecha entonces se mantendria en pantalla el C8 y el C9 y desapareceria entonces el C7 lo mismo ocurriria si pulsase a la izquierda o arriba o abajo
Si esto fuese muy engorroso quiza a ti se te ocurra alguna idea mejor podria ser por ejemplo a partir del mapa original que aumentase a modo de lupa
el codigo que uso para la pagina es el de Tunait
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style>
a {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #990033;
}
</style>
<script language="javascript">
//Ventana ajustada a foto versión 2 por tunait
var estilos = 'estilos.css' //nombre o ruta de hoja de estilos
var titulo = "Galería de fotos" //título de la ventana popup
afotos=new Array()
afotos[0]="fotos/tibidabo.jpg"
afotos[1]="fotos/gato.jpg"
afotos[2]="fotos/paloma.jpg"
afotos[3]="fotos/alenanene.jpg"
var ventana
function afoto(cual)
{
if(ventana){ventana.close()}
buscar(cual)
ventana=window. open('','ventana','resize=yes,scrollbars=no,resiza ble=yes')
ventana.document.writeln ('<html><head><link href="' + estilos + '" rel="stylesheet" type="text/css">')
ventana.document.writeln('<title>' + titulo + '</title></head>')
ventana.document.writeln('<body marginwidth="0" marginheight="0" topmargin="0" bottommargin="0" leftmargin="0" rightmargin="0" style="overflow:hidden"><div align="center"><img id="foto" alt="mi foto" src="' + cual + '" onLoad="opener.redimensionar(this.width, this.height)" onClick="if(opener.cont==opener.afotos.length-1){opener.cont=0}else{opener.cont++};document.getE lementById(\'foto\').src =opener.afotos[opener.cont];return false" >')
ventana.document.writeln('<br><a href="#" onClick="if(opener.cont==0){opener.cont=opener.afo tos.length-1}else{opener.cont--};document.getElementById(\'foto\').src =opener.afotos[opener.cont];return false">anterior</a>')
ventana.document.write(' | <a href="#" onClick="if(opener.cont==opener.afotos.length-1){opener.cont=0}else{opener.cont++};document.getE lementById(\'foto\').src =opener.afotos[opener.cont];return false">siguiente</a></div>')
ventana.document.writeln ('</body></html>')
ventana.document.close()
}
var cont
function redimensionar(ancho, alto)
{
ventana.resizeTo(ancho+12,alto+78)
ventana.moveTo((screen.width - ancho)/2,(screen.height - (alto+78))/2)
}
function buscar(que)
{
for(c=0;c<afotos.length;c++)
{
if(afotos[c]==que)
{cont= c;
return cont
break}
}
}
function cursor(){
if(navigator.appName=="Netscape"){var manita='pointer'}
else{var manita='hand'}
for (m=0;m<document.getElementsByTagName('a').length;m ++){
document.getElementsByTagName('a')[m].className='verEjemplo'}
}
</script>
<link href="../estcodigos.css" rel="stylesheet" type="text/css">
</head>
<body bgcolor="#FFFFFA" text="#000000" onload="cursor()">
<div align="center"><a href="javascript
:afoto('fotos/tibidabo.jpg')">imagen1</a>
<a href="javascript
:afoto('fotos/gato.jpg')">imagen2</a> <a href="javascript
:afoto('fotos/paloma.jpg')">imagen3</a>
<a href="javascript
:afoto('fotos/alenanene.jpg')">imagen4</a> </div>
</body>
</html>