Foros del Web » Programando para Internet » Javascript »

Ayudita Para Una Iniciada, Temporizador En MenÚ

Estas en el tema de Ayudita Para Una Iniciada, Temporizador En MenÚ en el foro de Javascript en Foros del Web. hola q tal soy una iniciada en el diseño web, con el Dreamweaver me manejo, pero de programación mis conocimientos son más bien escasos, he ...
  #1 (permalink)  
Antiguo 16/06/2004, 16:37
 
Fecha de Ingreso: junio-2004
Mensajes: 2
Antigüedad: 19 años, 10 meses
Puntos: 0
Sonrisa Ayudita Para Una Iniciada, Temporizador En MenÚ

hola q tal soy una iniciada en el diseño web, con el Dreamweaver me manejo, pero de
programación mis conocimientos son más bien escasos, he diseñado una web para el salón de peluquería
de mi madre y me vendría muy bien poner un menú parecido a este q he encontrado en una web, el problema
de este menú es q si te sales de él no tiene ningún tipo de retardo q te lo deje activo un par de
segundos, para dentro de ese intervalo de tiempo poder regresar a él sin q desaparezca.

He estado haciendo probatinas con setTimeout y cleaTimeout, pero no me acaba de salir.

Os pongo el código del htm y del css, a ver en q me podeis ayudar.

Bueno aunq no me solucioneis el problema os agradezco la atención y la pérdida de tiempo,
Gracias y besos desde Madrid,

salu2


MENU.HTM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD><TITLE>Menú Prensa</TITLE>
<META http-equiv=Content-Type content="text/html; charset=iso-8859-1"><LINK
href="normal.css" type=text/css rel=stylesheet>
</HEAD>
<BODY leftMargin=0 topMargin=0 marginheight="0" marginwidth="0">
<DIV id=contenedor>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<DIV id=col_izq>
<DIV id=mn>
<p>
<SCRIPT>
function showDiv(v){
var el = document.getElementById('sd');
var fl = document.getElementById('fd');
el.style.top = - parseInt(el.offsetHeight/2);
el.style.left = parseInt(fl.offsetWidth - 10);
el.style.visibility = v ? 'visible' : 'hidden';
}
</SCRIPT>
</p>
<DIV class=bgbdy id=fd onmouseover=showDiv(true) onmouseout=showDiv(false)><A
class=lnk
href="http://www.masprensa.com/">Más
Revistas</A>
<div style="POSITION: relative">
<div id=sd style="VISIBILITY: hidden; POSITION: absolute">
<table cellspacing=0 cellpadding=0 width="100%" border=0>
<tbody>
<tr>
<td valign=top> <div class=bgbdyalt><a class=lnk href="http://www.ar-revista.wanadoo.es/"
target=_blank j4="ar_layer" j3="revistas">AR</a></div>
<div class=bgbdyalt><a class=lnk
href="http://www.caranddriverrevista.wanadoo.es/" target=_blank
j4="caranddriver_layer" j3="revistas">Car and Driver</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.casadiez.wanadoo.es/"
target=_blank j4="casadiez_layer" j3="revistas">Casa Diez</a></div>
<div class=bgbdyalt><a class=lnk
href="http://www.cliorevista.wanadoo.es/clio/" target=_blank
j4="clio_layer" j3="revistas">Clío</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.crecerfeliz.wanadoo.es/"
target=_blank j4="crecerfeliz_layer" j3="revistas">Crecer Feliz</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.deviajes.wanadoo.es/"
target=_blank j4="deviajes_layer" j3="revistas">Deviajes</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.diezminutos.wanadoo.es/"
target=_blank j4="diezminutos_layer" j3="revistas">Diez Minutos</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.elle.wanadoo.es/"
target=_blank j4="elle_layer" j3="revistas">Elle</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.elledeco.wanadoo.es/"
target=_blank j4="elledeco_layer" j3="revistas">Elle Deco</a></div>
<div class=bgbdyalt><a class=lnk
href="http://www.emprendedores.wanadoo.es/" target=_blank
j4="emprendedores_layer" j3="revistas">Emprendedores</a></div></td>
<td valign=top> <div class=bgbdyalt><a class=lnk href="http://www.fotogramas.wanadoo.es/"
target=_blank j4="fotogramas_layer" j3="revistas">Fotogramas</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.que-leer.wanadoo.es/"
target=_blank j4="queleer_layer" j3="revistas">Qué Leer</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.quemedices.wanadoo.es/"
target=_blank j4="quemedices_layer" j3="revistas">¡Qué me dices!</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.quo.wanadoo.es/"
target=_blank j4="quo_layer" j3="revistas">Quo</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.ragazza.wanadoo.es/"
target=_blank j4="ragazza_layer" j3="revistas">Ragazza</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.supertele.wanadoo.es/"
target=_blank j4="supertele_layer" j3="revistas">Supertele</a></div>
<div class=bgbdyalt><a class=lnk
href="http://www.teleindiscreta.wanadoo.es/" target=_blank
j4="teleindiscreta_layer" j3="revistas">Teleindiscreta</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.tele-novela.wanadoo.es/"
target=_blank j4="telenovela_layer" j3="revistas">Telenovela</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.t-p.wanadoo.es/"
target=_blank j4="tp_layer"
j3="revistas">Tp</a></div></td>
</tr>
</tbody>
</table>
</div>
</div>
</DIV>
</DIV>
</DIV>
</DIV>
</BODY>
</HTML>



NORMAL.CSS
A {
FONT-SIZE: 11px; LINE-HEIGHT: 13px; FONT-FAMILY: Arial, Helvetica, sans-serif; TEXT-DECORATION: none
}
.lnk {
COLOR: #000
}
#col_izq {
FLOAT: left; WIDTH: 138px; max-width: 138px
}
#mn .bgbdy {
PADDING-LEFT: 10px; HEIGHT: 20px
}
#sd .bgbdyalt {
PADDING-LEFT: 10px; HEIGHT: 20px
}
#mn .lnk {
LINE-HEIGHT: 17px
}
#mn .bgbdy {
BORDER-TOP: #fff 1px solid; BACKGROUND-COLOR: #efefef
}
#sd {
WIDTH: 276px
}
#sd .bgbdyalt {
BORDER-RIGHT: #ffffff 1px solid; BORDER-TOP: #ffffff 1px solid
}
#sd TABLE {
BORDER-RIGHT: #c03 1px solid; BORDER-TOP: #c03 1px solid; BORDER-LEFT: #c03 1px solid; BORDER-BOTTOM: #c03 1px solid; BACKGROUND-COLOR: #efefef
}
  #2 (permalink)  
Antiguo 17/06/2004, 00:16
 
Fecha de Ingreso: diciembre-2002
Mensajes: 27
Antigüedad: 21 años, 4 meses
Puntos: 0
prueba el siguiente codigo en lugar de la ultima linea de la funcion showDiv

if (v=='hidden')
{ setTimeout("el.style.visibility='hidden'",2000);
}
else
{ el.style.visibility='visible';
}

El setTimeOut hace que espere x milisegundos a ejecutar la instruccion, en este caso 2 segundos, puedes cambiar el valor segun veas. En cualquier caso, no es del todo fiable ya que se le puede ir la olla si andas entrando y saliendo de la opcion... espero que te ayude al menos!

un saludo ;)
  #3 (permalink)  
Antiguo 17/06/2004, 03:10
 
Fecha de Ingreso: junio-2004
Mensajes: 2
Antigüedad: 19 años, 10 meses
Puntos: 0
De acuerdo Gracias aunke no vaya del todo

muchas gracias por la atención, ya q eres el único q me ha respondido, el menú no va del todo, se queda fijo al hacer onmouseover y ya no desaparece nunca, voy a ver probar a ver si consigo dar con la solución

de dónde eres?????

saludos y besos desde la capital

vane
  #4 (permalink)  
Antiguo 17/06/2004, 03:16
 
Fecha de Ingreso: diciembre-2002
Mensajes: 27
Antigüedad: 21 años, 4 meses
Puntos: 0
de nada, a todos nos gusta que nos ayuden.

soy de gipuzkoa, ahora estoy en el curro pero si tengo un rato lo intento arreglar

suerte!!!
  #5 (permalink)  
Antiguo 17/06/2004, 05:35
Avatar de living  
Fecha de Ingreso: mayo-2004
Mensajes: 1.266
Antigüedad: 20 años
Puntos: 2
Prueba con esta función showdiv()

function showDiv(v){
var el = document.getElementById('sd');
var fl = document.getElementById('fd');
el.style.top = - parseInt(el.offsetHeight/2);
el.style.left = parseInt(fl.offsetWidth - 10);

if (!v)
{
setTimeout("document.getElementById('sd').style.vi sibility='hidden'",2000);
}
else
{
el.style.visibility='visible';
}

}
__________________
¿Te apasiona el mundo del guión? El portal del guión
  #6 (permalink)  
Antiguo 17/06/2004, 09:22
 
Fecha de Ingreso: diciembre-2002
Mensajes: 27
Antigüedad: 21 años, 4 meses
Puntos: 0
Todo el codigo, que creo que ya lo hace perfecto, he utilizado una variable para saber si esta encima o no y asi saber si tiene que quitarlo o no. Algo de codigo viejo sobra, pero en fin, asi funciona. En rojo el codigo cambiado:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD><TITLE>Menú Prensa</TITLE>
<META http-equiv=Content-Type content="text/html; charset=iso-8859-1"><LINK
href="normal.css" type=text/css rel=stylesheet>
</HEAD>
<BODY leftMargin=0 topMargin=0 marginheight="0" marginwidth="0">
<DIV id=contenedor>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<DIV id=col_izq>
<DIV id=mn>
<p>
<SCRIPT>
var intEncima=0;
function showDiv(v){
intEncima=1;
var el = document.getElementById('sd');
var fl = document.getElementById('fd');
el.style.top = - parseInt(el.offsetHeight/2);
el.style.left = parseInt(fl.offsetWidth - 10);
el.style.visibility = v ? 'visible' : 'hidden';
}
function esperate()
{ intEncima=0;
setTimeout("miraaver()",2000);
}
function miraaver()
{ if (intEncima==0)
{ showDiv(false);
}
}

</SCRIPT>
</p>
<DIV class=bgbdy id=fd onmouseover=showDiv(true) onmouseout=esperate()><A
class=lnk
href="http://www.masprensa.com/">Más
Revistas</A>
<div style="POSITION: relative">
<div id=sd style="VISIBILITY: hidden; POSITION: absolute">
<table cellspacing=0 cellpadding=0 width="100%" border=0>
<tbody>
<tr>
<td valign=top> <div class=bgbdyalt><a class=lnk href="http://www.ar-revista.wanadoo.es/"
target=_blank j4="ar_layer" j3="revistas">AR</a></div>
<div class=bgbdyalt><a class=lnk
href="http://www.caranddriverrevista.wanadoo.es/" target=_blank
j4="caranddriver_layer" j3="revistas">Car and Driver</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.casadiez.wanadoo.es/"
target=_blank j4="casadiez_layer" j3="revistas">Casa Diez</a></div>
<div class=bgbdyalt><a class=lnk
href="http://www.cliorevista.wanadoo.es/clio/" target=_blank
j4="clio_layer" j3="revistas">Clío</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.crecerfeliz.wanadoo.es/"
target=_blank j4="crecerfeliz_layer" j3="revistas">Crecer Feliz</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.deviajes.wanadoo.es/"
target=_blank j4="deviajes_layer" j3="revistas">Deviajes</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.diezminutos.wanadoo.es/"
target=_blank j4="diezminutos_layer" j3="revistas">Diez Minutos</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.elle.wanadoo.es/"
target=_blank j4="elle_layer" j3="revistas">Elle</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.elledeco.wanadoo.es/"
target=_blank j4="elledeco_layer" j3="revistas">Elle Deco</a></div>
<div class=bgbdyalt><a class=lnk
href="http://www.emprendedores.wanadoo.es/" target=_blank
j4="emprendedores_layer" j3="revistas">Emprendedores</a></div></td>
<td valign=top> <div class=bgbdyalt><a class=lnk href="http://www.fotogramas.wanadoo.es/"
target=_blank j4="fotogramas_layer" j3="revistas">Fotogramas</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.que-leer.wanadoo.es/"
target=_blank j4="queleer_layer" j3="revistas">Qué Leer</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.quemedices.wanadoo.es/"
target=_blank j4="quemedices_layer" j3="revistas">¡Qué me dices!</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.quo.wanadoo.es/"
target=_blank j4="quo_layer" j3="revistas">Quo</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.ragazza.wanadoo.es/"
target=_blank j4="ragazza_layer" j3="revistas">Ragazza</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.supertele.wanadoo.es/"
target=_blank j4="supertele_layer" j3="revistas">Supertele</a></div>
<div class=bgbdyalt><a class=lnk
href="http://www.teleindiscreta.wanadoo.es/" target=_blank
j4="teleindiscreta_layer" j3="revistas">Teleindiscreta</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.tele-novela.wanadoo.es/"
target=_blank j4="telenovela_layer" j3="revistas">Telenovela</a></div>
<div class=bgbdyalt><a class=lnk href="http://www.t-p.wanadoo.es/"
target=_blank j4="tp_layer"
j3="revistas">Tp</a></div></td>
</tr>
</tbody>
</table>
</div>
</div>
</DIV>
</DIV>
</DIV>
</DIV>
</BODY>
</HTML>
  #7 (permalink)  
Antiguo 18/06/2004, 02:45
Avatar de Carlitos
Usuario no validado
 
Fecha de Ingreso: mayo-2001
Ubicación: Zaragoza
Mensajes: 1.304
Antigüedad: 23 años
Puntos: 25
Hola.

Aquí tienes otra solución más sencilla.

<DIV class="bgbdy" id="fd" onmouseover="showDiv(true)" onmouseout="setTimeout('showDiv(false)',2000)">

Un saludo.
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 20:08.