Quizas sea un reto

mamagallo · #1 (**permalink**) 27/04/2003, 10:45

Hola muchachones, hace algún tiempo que no intervengo, por estar algo ocupadillo y no tener nada interesante que plantear, pero hace un par de dias me estubo dando vueltas en la cabeza algo que quizas no se pueda hacer.
veamos tengo una pagina de marcos, ahora bien, el marco de la derecha contiene un mapa de imagenes que contiene un direccionamiento a una secciçon en especifico, ahora bien, lo que quiero hacer es que cuando coloque el ratón sobre cualquier región del mapa de imagenes, en el marco derecho quiero que aparesca una descripción de la sección de destino, que si es necesario esa descripción pueda soportar contener una imagen y que por supuesto funcione en netscape y en el internet explorer por igual.
Cuento con scrip que hace el efecto que quiero pero dentro de una misma pagina y creo que se puede adaptar para que funcione en una con marcos, aunque la descripción no soporta imagenes.
a continuación el script que tengo:

mamagallo · #2 (**permalink**) 27/04/2003, 10:49

Código:

<head>
<script language="JavaScript1.2">

// Bottom slide tooltip- by Ron Grafe ([email protected])
// Website URL: http://www.lonestar.texas.net/~rgrafe
// Featured on Dynamic Drive -http://www.dynamicdrive.com

//SET TOOLTIP DESCRIPTIONS BELOW
//Extend or contract array as needed
var description=new Array()
description[0]='<i>descripción aqui'
description[1]='<i>descripción aqui'
description[2]='<i>descripción aqui'
description[3]='<i>descripción aqui'

//Do not edit below here

iens6=document.all||document.getElementById
ns4=document.layers

<!--GLOBAL VARIABLES-->
var thename
var theobj
var thetext
var winHeight
var winPositionFromTop
var winWidth
var startH=2
var openTimer
<!--END GLOBAL VARIABLES-->

<!--GLOBAL FUNCTIONS-->
function setObj(text,theswitch,inwidth,inheight) {
	thetext=text
	if(iens6){
		thename = "viewer"
		theobj=document.getElementById? document.getElementById(thename):document.all.thename
		winHeight=100
			if(iens6&&document.all) {
				winPositionFromTop=document.body.clientHeight
				winWidth=(document.body.clientWidth-document.body.leftMargin)
			}
			if(iens6&&!document.all) {
				winPositionFromTop=window.innerHeight
				winWidth=(window.innerWidth-(document.body.offsetLeft+30))
			}
			if(theswitch=="override") {
				winWidth=inwidth
				winHeight=inheight
			}
		theobj.style.width=winWidth
		theobj.style.height=startH
			if(iens6&&document.all) {
				theobj.style.top=document.body.scrollTop+winPositionFromTop
				theobj.innerHTML = ""
				theobj.insertAdjacentHTML("BeforeEnd","<table cellspacing=0 width="+winWidth+" height="+winHeight+" border=1><tr><td width=100% valign=top><font type='times' size='2' style='color:black;font-weight:normal'>"+thetext+"</font></td></tr></table>")
			}
			if(iens6&&!document.all) {
				theobj.style.top=window.pageYOffset+winPositionFromTop
				theobj.innerHTML = ""
				theobj.innerHTML="<table cellspacing=0 width="+winWidth+" height="+winHeight+" border=1><tr><td width=100% valign=top><font type='times' size='2' style='color:black;font-weight:normal'>"+thetext+"</font></td></tr></table>"
			}
	}
	if(ns4){
		thename = "nsviewer"
		theobj = eval("document."+thename)
		winPositionFromTop=window.innerHeight
		winWidth=window.innerWidth
		winHeight=100
			if(theswitch=="override") {
				winWidth=inwidth
				winHeight=inheight
			}
		theobj.moveTo(0,eval(window.pageYOffset+winPositionFromTop))
		theobj.width=winWidth
		theobj.clip.width=winWidth
		theobj.document.write("<table cellspacing=0 width="+winWidth+" height="+winHeight+" border=1><tr><td width=100% valign=top><font type='times' size='2' style='color:black;font-weight:normal'>"+thetext+"</font></td></tr></table>")
		theobj.document.close()
	}
	viewIt()
}

function viewIt() {
	if(startH<=winHeight) {
		if(iens6) {
			theobj.style.visibility="visible"
				if(iens6&&document.all) {
					theobj.style.top=(document.body.scrollTop+winPositionFromTop)-startH
				}
				if(iens6&&!document.all) {
					theobj.style.top=(window.pageYOffset+winPositionFromTop)-startH
				}
			theobj.style.height=startH
			startH+=2
			openTimer=setTimeout("viewIt()",10)
		}
		if(ns4) {
			theobj.visibility = "visible"
			theobj.moveTo(0,(eval(window.pageYOffset+winPositionFromTop)-startH))
			theobj.height=startH
			theobj.clip.height=(startH)
			startH+=2
			openTimer=setTimeout("viewIt()",10)
		}
	}else{
		clearTimeout(openTimer)
	}
}

function stopIt() {
	if(iens6) {
		theobj.innerHTML = ""
		theobj.style.visibility="hidden"
		startH=2
	}
	if(ns4) {
		theobj.document.write("")
		theobj.document.close()
		theobj.visibility="hidden"
		theobj.width=0
		theobj.height=0
		theobj.clip.width=0
		theobj.clip.height=0
		startH=2
	}
}
<!--END GLOBAL FUNCTIONS-->
</script>

<body>
 <script language="JavaScript1.2">
if (iens6){
document.write("<div id='viewer' style='background-color:#FFFFCC;visibility:hidden;position:absolute;left:0;width:0;height:0;z-index:1;overflow:hidden;border:1px ridge white'></div>")
}
if (ns4){
	hideobj = eval("document.nsviewer")
	hideobj.visibility="hidden"
}
    </script>

<table border="4" cellpadding="2" cellspacing="4" bordercolor="#FF0000" width="628" id="AutoNumber1" height="279">
      <tr>
        <td height="100" align="center" width="205"><a target="_blank" href="http://URL de destino/" onmouseover="setObj(description[0],'override',550,65)" onmouseout="clearTimeout(openTimer);stopIt()"><img border="0" src="imagen.gif" width="152" height="91"></a></td>
        <td width="205" height="100" align="center">&nbsp;</td>
        <td width="206" height="100" align="center"><img border="0" src="imagen.gif" width="29" height="27"><img border="0" src="imagen.gif" width="29" height="27"><img border="0" src="imagen.gif" width="29" height="27"></td>
      </tr>
</table>

mamagallo · #3 (**permalink**) 27/04/2003, 10:51

como veran lo uso en una tabla, haber si alguno de los maestros gúrus me echa una mano con mi pequeño dolor de cabeza

caricatos · #4 (**permalink**) 28/04/2003, 11:55

Hola mamagallo:

¡Tanto tiempo!

No me he fijado en el código muy a fondo, porque indudablemente ¡hoy no es mi día!

Pero si te funciona algo en una página, debería funcionar en un sistema de marcos... siempre que pase por la jerarquía de marcos (parent, top...)
puedes poner una función en un marco der, y darle parámetros desde un marco izq:

der:
function mostrar(mensaje) {
alert(mensaje);
}

izq:
<input type=button value="hermanito" onclick="parent.izq.mostrar('hola hermanito')">

De esa manera puedes hacer muchas cosas en un frame desde otro del sistema.

Si tienes la página en algún sitio, dilo para verla.

Saludos

mamagallo · #5 (**permalink**) 28/04/2003, 14:17

Mi estimado Caricatos que gusto verte o mejor dicho, leerte

. bueno al script que puse lo uso en una tabla en mi web, pero el servidor resta caido desde el sabado en la madrugada y no ha habido forma de que los hij@#~$%& del sevidor lo levanten, pero en fin eso es otra historia, en fin debi haberme levantado con la pierna derecha por que uno de los maestros del foro entro en mi post

.
hare algo, voy a subir la pagina a mi sitio en lycos y te pongo la dirección para que veas que quiero hacer, ya que lo más probable es que no me sepa explicar bien, aunque resolvi no usar esta idea, me gustaria explorarla pues me parece interesante el poder tener esta opción, en un rato te pongo la dirección.
un millon por detenerte a prestarm,e atención.
PD. cuestan caras tus caricaturas? quisiera regalarle una a mi jeva

mamagallo · #6 (**permalink**) 28/04/2003, 15:15

ya la subi esta es la direcciónhttp://usuarios.lycos.es/mamagallo/mipo/mipos.htm
es la pagina de marcos preliminar que hice, no es el diseño final pero te dara una idea.
de antemano muchas gracias

mamagallo · #7 (**permalink**) 28/04/2003, 15:30

se me olvidaba decirte que la resolución que uso es a 1024

caricatos · #8 (**permalink**) 28/04/2003, 18:20

Hola mamagallo:

Estuve viendo el código, y es algo complicado...

Hay una variable:
thename = "viewer"...
que es un div que se escribe en la página principal, la cuestión es que debe estar en el frame lateral, y poner algo así:
thename = parent.derecho.getElementById("viewer")...

y hacer compatibles las cosas.

Bueno... mañana sigo.

Saludos

mamagallo · #9 (**permalink**) 28/04/2003, 18:36

gracias caricatos, ya decia yo que la cosa no era facil y podria ser un reto :)

caricatos · #10 (**permalink**) 01/05/2003, 03:18

Hola otra vez:

Mira, como es muy difícil retocar el código de otros te comento como estuve haciendo lo que pides:
Para evitar los problemas de compatibilidad entre ordenadores, puse a la derecha un documento en blanco (tal vez puede que no sea necesaria su existencia, pero lo creé)

y en cada elemento area tienes que quitar los onmouseover/onmouseout, y poner un onclick="mostrar(n)"... donde n es el número correspondiente al array de la descripción.

El tag script me ha quedado de esta manera:

Código PHP:

  <SCRIPT language=Javascript> 
var description=new Array() 
description[0]='descripción 0'; 
description[1]='descripción 1'; 
description[2]=''descripción 2; 
... 
 
function mostrar(n)    { 
    parent.derecho.location.reload(); 
    parent.derecho.document.write(description[n]); 
} 
</SCRIPT>

Si necesitas explicaciones o que lo suba para que lo veas, avísa...

Saludos

mamagallo · #11 (**permalink**) 08/05/2003, 17:12

vaya, habia olvidado lo rapido que se mueve este foro, Caricatos disculpa, la tardanza pero res que me dio una peste de esdas que te vuelve alergico a todo lo que signifique un poco de esfuerzo :), aún no salgo de ella pero le hago la lucha, probare el codigo asi a ver y te aviso ;) , un abrazo