li:hover en IE(sin JS)

B** · #1 (**permalink**) 13/02/2007, 13:11

Se pueda hacer un li:hover QUE FUNCIONE EN IE:@ sin JS ?... En firefox si me funciona:

Código HTML:

#tabs ul li:hover  {
   display: block;
   background-color: Black;
}

Lei que IE solo interpreta los "hover" de los elementos "a".No se si alguien sepa de algun "hack" .
Un saludo y gracias.

JavierB · #2 (**permalink**) 13/02/2007, 13:17

Hola B**

Has leido bien, la única forma de conseguirlo con IE, hasta la versión 6, es metiendolo dentro de un enlace. En la versión 7 de Explorer si funciona.

Saludos,

B** · #3 (**permalink**) 13/02/2007, 13:34

Si hago esto:

Código HTML:

#tabs li a:hover{
   background-color: Black;
}

Es posible hacer que el background sea mas largo que el contenido del enlace?

JavierB · #4 (**permalink**) 13/02/2007, 13:37

Hola de nuevo.

Prueba poniendo el ancho con width

li:hover {background-color: Black; width:100px}

Saludos,

B** · #5 (**permalink**) 13/02/2007, 13:42

Gracias JavierB... pero ya habia hecho eso y no funciona..

JinRoh · #6 (**permalink**) 13/02/2007, 15:34

Prueba "whatever:hover" xs4all.nl/~peterned/csshover.html

AlZuwaga · #7 (**permalink**) 13/02/2007, 16:27

Cita:

Iniciado por B**

Gracias JavierB... pero ya habia hecho eso y no funciona..

creo que le tenés que poner

Código:

display:block;
ancho: XXXpx;
alto: YYYpx;

(no recuerdo cómo se escribe ancho y alto en ingles... así que traducilo ;)

baccxus · #8 (**permalink**) 13/02/2007, 17:56

Cita:

Iniciado por Al Zuwaga

(no recuerdo cómo se escribe ancho y alto en ingles... así que traducilo ;)

ancho = width
alto = height

Saludos

AlZuwaga · #9 (**permalink**) 14/02/2007, 10:28

Gracias baccxus. La combinación de letras t y h me vuelven loco. Siempre las escribo mal

B** · #10 (**permalink**) 14/02/2007, 17:35

Pues ya ni supe que hice, el asunto es que ya funciona en FF y en IE...lo resolvi a fuerza bruta, jaja
Aqui esta el CSS por si alguien quiere velo:
http://fit.um.edu.mx/bsm/css/estructura.css
Esta un poco desordenado, aun lo voy a modificar.
Un saludo

miguelelinventor · #11 (**permalink**) 10/06/2008, 13:22

Hola yo tengo el mismo problema... el enlace al css no funciona! alquien que ponga completo que hace falta poner en el css para que la funcion hover funcione en ie??
salu2

webosiris · #12 (**permalink**) 10/06/2008, 13:38

hola miguel, si usas "script ie7" te va a funcionar... es un pequeño js que arregla muchas fallas de los IE 6 y 7

miguelelinventor · #13 (**permalink**) 11/06/2008, 02:44

Muxisisimas gracias webosiris esta si que ha sido una gran ayuda :)
salu2

guarus · #14 (**permalink**) 28/11/2009, 17:12

Gracias a todos, pero no me funciona usando "script ie7" que dice webosiris, o al menos no se si lo estoy utilizando bien, si tienen un codigo de ejemplo funcionando le agraderia que lo colocaran.

webosiris · #15 (**permalink**) 30/11/2009, 14:04

guarus, en el mismo sitio del script tienes un ejemplo

gazaposa · #16 (**permalink**) 21/12/2009, 05:44

hola a todos, tengo un problema con un menu desplegable. en Fireox,pero ni en IE6, ni IE7 ni en IE8 me funciona.
alguien me puede decir pq, muchiiiiiiisimas gracias
os pego el codigo:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Documento sin título</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
a:link {
text-decoration:none;
font-family:Garamond, "Times New Roman";
font-size: 14px;
color: #6C5704;
font-weight: bold;
}
a:visited {
text-decoration:none;
font-family:Garamond, "Times New Roman";
font-size: 14px;
color: #6C5704;
font-weight: bold;
}
a:hover{
text-decoration:none;
font-family: Garamond, "Times New Roman";
font-size: 14px;
color:#6C5704;
font-weight: bold;
}
a:active{
text-decoration:none;
font-family:"Garamond", "Times New Roman";
font-size: 14px;
font-weight: bold;
color: #6C5704;
}
</style>

<style>
#foldheader{cursor:hand ; font-weight:bold ; //para que aparezca la mano en el raton
list-style-image:url(fold.gif)}
#foldinglist{list-style-image:url(list.gif)}
ul.menu
{
line-height: 150%;
list-style:none;
}
ul.menu ul /* Para todos los ul debajo del ul.menu */
{
display:none;
list-style:none;
}

/* Esto afecta a todos los ul inmediatamente debajo (el > ) de un li que a su vez esté dentro de un ul.menu */
ul.menu li:hover > ul
{
display:block;
}

</style>
<link href="../../estilos/links_indices.css" rel="stylesheet" type="text/css">
<link href="../../estilos/letra.css" rel="stylesheet" type="text/css">
</head>

<body background="../../imagenes/indiceyacimientos.jpg">
<ul class="menu">
<li><a href="aragon/aragon.htm" class="letra"target="mainFrame"><span class="letra">Aragón </span> </a>

<ul>
<li><a href="aragon/tarazona/tarazona.htm"target="mainFrame">Tarazona</a></li>
<li><a href="aragon/frescano/frescano.htm"target="mainFrame">Frescano</a></li>
<li><a href="aragon/borja/borja.htm"target="mainFrame">Borja</a></li>
<li><a href="aragon/calatayud/calatayud.htm"target="mainFrame">Calatayud</a></li>
<li><a href="aragon/berrueco/berrueco.htm"target="mainFrame">Berrueco</a></li>
<li><a href="aragon/zaragoza/zaragoza.htm"target="mainFrame">Zaragoza</a></li>
<li><a href="aragon/caminreal/caminreal.htm"target="mainFrame">Caminreal</a></li>
<li><a href="aragon/teruel/teruel.htm"target="mainFrame">Teruel</a></li>
</ul>
</li>

<li><a href="castillaleon/castillaleon.htm"target="mainFrame"><span class="letra">Castilla León
</span></a>
<ul>
<li><a href="castillaleon/huerta/huerta.htm"target="mainFrame">Huerta del Rey</a></li>
<li><a href="castillaleon/garray/garray.htm"target="mainFrame">Garray</a></li>
<li><a href="castillaleon/osma/osma.htm"target="mainFrame">El Burgo de Osma</a></li>
<li><a href="castillaleon/montejo/montejo.htm"target="mainFrame">Montejo de Tiermes</a></li>
<li><a href="castillaleon/medinaceli/medinaceli.htm"target="mainFrame">Medinaceli</a></li>
<li><a href="castillaleon/soria/soria.htm"target="mainFrame">Soria</a></li>
</ul>
</li>
<li><a href="castillalamancha/castillalamancha.htm"target="mainFrame"><span class="letra">Castilla la Mancha </span></a>
<ul>
<li><a href="castillalamancha/saelices/saelices.htm"target="mainFrame">Saleices</a></li>
<li><a href="castillalamancha/cueva/cueva.htm"target="mainFrame">Cueva del
Rey</a></li>
<li><a href="castillalamancha/cuenca/cuenca.htm"target="mainFrame">Cuenca</a></li>
<li><a href="castillalamancha/herreria/herreria.htm"target="mainFrame">Herrería</a></li>
<li><a href="castillalamancha/molina/molina.htm"target="mainFrame">Molina
de Aragón</a></li>
</ul>
</li>

<li><a href="larioja/larioja.htm"target="mainFrame"><span class="letra">La Rioja</span> </a>
<ul>
<li><a href="larioja/aquilar.htm"target="mainFrame">Aquilar Río Alhama</a></li>
</ul>
</li>

<li><a href="navarra/navarra.htm"target="mainFrame"><span class="letra">Navarra</span>
</a>
<ul>
<li><a href="navarra/castejon.htm"target="mainFrame">Castejón</a></li>
</ul>
</li>
</ul>
</body>
</html>

severicks · #17 (**permalink**) 21/12/2009, 11:48

revisa este post, http://www.forosdelweb.com/f53/menu-...00-css-595007/ es un menu desplegable funcional mara firefox y todas las versiones de ie hecho solo con css y html

gazaposa · #18 (**permalink**) 22/12/2009, 01:25

hola de nuevo, no me sirven esos ejemplos pq estan todos en horizontal y yo lo quiero en vertical.
no sabrias decirme pq no me funciona el mio?
muchas gracias

gazaposa · #19 (**permalink**) 22/12/2009, 01:33

hola otra vez, estoy probando los menus y si que me salen en vertical, pero no funciona, me salen todas las opciones ya desplegadas