Agrupar etiquetas CSS en Jquery

bNd170 · #1 (**permalink**) 26/01/2011, 17:46

No se si esta consulta es más de CSS pero la pongo aquí.

Mi intencion es que al hacer el evento mouseover de un div que contiene un menú hecho con <UL> dicho menú se oculte. La cuestión es que si cambio de <LI> el menú se oculta, creo que es porque el navegador asocia el mouse a la capa mas "alta" con lo cual, la capa inferior contenedora que es un div, si el mouse esta en el UL o en un LI, ya considera que el evento mouseover se ha cumplido y el menú se oculta.

¿Hay alguna forma de decirle al jQuery que el evento es agrupado? Es decir, que solo se ejecute si el mouse realmente no está en ningun LI, UL y ha salido del div?.

redbumlandia · #2 (**permalink**) 27/01/2011, 00:54

Tienes que configurarar la propiedad z-index recuerda que mientras mas alto es el numero de esta propiedad mas sobresale de los demas elementos, el tango de z-index va desde 0 a 9999 .

bNd170 · #3 (**permalink**) 27/01/2011, 02:55

Pense en z-index, pero eso no impediria que el menu funcionase? Es decir, si pongo por encima la capa contenedora; no dejaria de verse el menu?

Dany_s · #4 (**permalink**) 27/01/2011, 06:56

http://api.jquery.com/not-selector/
http://api.jquery.com/has-selector/

Código HTML:

Ver original<html>
    <head>
        <title>Ejemplo</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
        <script>
            $(function(){
                $('div:not(:has(ul))').hover( function(){
                   $(this).css('background', 'red');
                }, function(){
                    $(this).css('background', 'blue');
                });
            });
        </script>
    </head>
    <body>
 
        <div>
            div con ul
            <ul>
                <li>li</li>
            </ul>
        </div>
        <div>div sin ul</div>
 
    </body>
</html>