opciones vistas al pasar el ratón

09/08/2004 - 18:00 por carlos lagares | Informe spam
Hola foro,
Quisiera saber cómo puedo realizar un submenú de opciones
que e vean al pasar el ratón por su enlace en el menú
prinipal. Es decir,

tengo un menú con las siguientes opciones:
Tipo de cristales | tipo de suelos , etc..

me gustaría que al poner el mouse sobre tipo de
cristales, se haga visible un sub menú, en forma de
tabla, por ejemplo, en el que vean las categorías de
cridtales que se hallan en el almacén, y cuando el
puntero del ratón no está encima, se oculte, y así con
tods las opciones del menú disponibles.

Gracias
Carlos Lagares

Preguntas similare

Leer las respuestas

#1 Jorge Oblitas
10/08/2004 - 04:33 | Informe spam
busca ejemplos de DHTML usando onclick y el estilo display
en google

Jorge
"carlos lagares" wrote in message
news:295301c47e2a$0c5b1b00$
Hola foro,
Quisiera saber cómo puedo realizar un submenú de opciones
que e vean al pasar el ratón por su enlace en el menú
prinipal. Es decir,

tengo un menú con las siguientes opciones:
Tipo de cristales | tipo de suelos , etc..

me gustaría que al poner el mouse sobre tipo de
cristales, se haga visible un sub menú, en forma de
tabla, por ejemplo, en el que vean las categorías de
cridtales que se hallan en el almacén, y cuando el
puntero del ratón no está encima, se oculte, y así con
tods las opciones del menú disponibles.

Gracias
Carlos Lagares
Respuesta Responder a este mensaje
#2 Lalo Márquez
28/08/2004 - 03:00 | Informe spam
Aquí un ejemplo (tienes que pulsar sobre los enlaces para que se abran):



<html>

<head>
<meta name="GENERATOR" content="Microsoft FrontPage 6.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>


<style>
<!--
#foldheader{cursor:pointer;cursor:hand ; font-weight:bold ;
list-style-image:url(fold.gif)}
#foldinglist{list-style-image:url(list.gif)}
//-->
</style>
<script language="JavaScript1.2">
<!--

//Smart Folding Menu tree- By Dynamic Drive (rewritten 03/03/02)
//For full source code and more DHTML scripts, visit
http://www.dynamicdrive.com
//This credit MUST stay intact for use

var head="display:''"
img1=new Image()
img1.src="fold.gif"
img2=new Image()
img2.src="open.gif"

var ns6=document.getElementById&&!document.all
var ie4=document.all&&navigator.userAgent.indexOf("Opera")==-1

function checkcontained(e){
var iscontained=0
cur=ns6? e.target : event.srcElement
i=0
if (cur.id=="foldheader")
iscontained=1
else
while (ns6&&cur.parentNode||(ie4&&cur.parentElement)){
if (cur.id=="foldheader"||cur.id=="foldinglist"){
iscontained=(cur.id=="foldheader")? 1 : 0
break
}
cur=ns6? cur.parentNode : cur.parentElement
}

if (iscontained){
var foldercontent=ns6? cur.nextSibling.nextSibling : cur.all.tags("UL")[0]
if (foldercontent.style.display=="none"){
foldercontent.style.display=""
cur.style.listStyleImage="url(open.gif)"
}
else{
foldercontent.style.display="none"
cur.style.listStyleImage="url(fold.gif)"
}
}
}

if (ie4||ns6)
document.onclick=checkcontained

//-->
</script>


</head>

<body>
<font face="Verdana">

<ul>
<li id="foldheader">News</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href="http://www.cnn.com">CNN<...lt;/li>
<li><a href="http://www.abcnews.com">ABC News</a></li>
<li><a href="http://www.news.bbc.co.uk">BBC News</a></li>
</ul>

<li id="foldheader">Webmaster</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href="http://www.dynamicdrive.com">Dynamic Drive</a></li>
<li><a href="http://www.javascriptkit.com">JavaScript Kit</a></li>
<li><a href="http://www.freewarejava.com"&g...lt;/li>
</ul>

<li id="foldheader">Nested Example</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href="http://www.dynamicdrive.com">outer 1</a></li>
<li><a href="http://www.dynamicdrive.com">outer 2</a></li>
<li id="foldheader">Nested</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href="http://www.dynamicdrive.com">nested 1</a></li>
<li><a href="http://www.dynamicdrive.com">nested 2</a></li>
</ul>
<li><a href="http://www.dynamicdrive.com">outer 3</a></li>
<li><a href="http://www.dynamicdrive.com">outer 4</a></li>
</ul>
</ul>

</font>

<p align="center"><font face="Arial" size="-2">Free DHTML scripts provided
by<br>
<a href="http://www.dynamicdrive.com">Dynamic Drive</a></font></p>
</body>

</html>













"carlos lagares" escribió en el
mensaje news:295301c47e2a$0c5b1b00$
Hola foro,
Quisiera saber cómo puedo realizar un submenú de opciones
que e vean al pasar el ratón por su enlace en el menú
prinipal. Es decir,

tengo un menú con las siguientes opciones:
Tipo de cristales | tipo de suelos , etc..

me gustaría que al poner el mouse sobre tipo de
cristales, se haga visible un sub menú, en forma de
tabla, por ejemplo, en el que vean las categorías de
cridtales que se hallan en el almacén, y cuando el
puntero del ratón no está encima, se oculte, y así con
tods las opciones del menú disponibles.

Gracias
Carlos Lagares



Este mensaje fue certificado Libre de Virus al ser Enviado.
Checked by AVG anti-virus system (http://www.grisoft.com).
Version: 6.0.737 / Virus Database: 491 - Release Date: 15/08/2004
email Siga el debate Respuesta Responder a este mensaje
Ads by Google
Help Hacer una preguntaRespuesta Tengo una respuesta
Search Busqueda sugerida