Página 1 de 1

LI:HOVER en espera

NotaPublicado: 2009-08-11 05:07 @255
por chavelito
Hola a todos, espero que me puedan ayudar en mi problema, es el siguiente: este script me funciona bien para poder hacer li:hover en IE6.

Al pasar el mouse en el li se pone en hover (se pinta de un color) y al sacarlo reemplaza el hover por un estilo vacío (se despinta el color).

Lo que yo quiero que haga es que cuando se de un clic en un li (el li tiene un enlace Ajax) se quede esperando en hover (se pinte de un color) hasta que se de clic en otro li.

Espero me hayan entendido; estuve averiguando, algunos eventos onmouseup y onmousedown pero la verdad no sé cómo aplicarlos.

Sintáxis: [ Descargar ] [ Ocultar ]
Using javascript Syntax Highlighting
<script type="text/javascript">
    startList = function() {
        if (document.all&&document.getElementById) {
            navRoot = document.getElementById("listmp3");
            for (i=0; i<navRoot.childNodes.length; i++) {
                node = navRoot.childNodes[i];
                if (node.nodeName=="LI") {
                    node.onmouseover=function() {
                        this.className+=" over";
                    }
                    node.onmouseout=function() {
                        this.className=this.className.replace(" over", "");
                    }
                }
            }
        }
    }
    window.onload=startList;
</script>
Coloreado en 0.002 segundos, usando GeSHi 1.0.8.4

Re: LI:HOVER en espera

NotaPublicado: 2009-08-11 05:59 @291
por explorer
Yo creo que lo que quieres hacer es:

Con el evento OnMouseClick sobre un objeto <li>, cambiar su estilo a 'seleccionado', y poner un estilo de 'normal' al resto de entradas, dejando la labor de cambiar de color cuando el ratón pasa a los eventos OnMouseOver y OnMouseOut, aunque también se puede hacer con CSS.

El estado de pulsado o no lo puedes guardar en alguna variable Javascript o mirando el estado en que se encuentra el objeto.

No sé si he acertado o no...

Re: LI:HOVER en espera

NotaPublicado: 2009-08-11 15:34 @690
por chavelito
Hola Explorer, gracias por responder.

Mira, te explico: yo estoy trabajando con un playlist en Javascript (reproductor musical sin flash). Bueno, lo que tu me dices, del css funciona normalmente en Firefox, no tengo ningún problema, solo con IE v6, que es donde quiero solucionar el problema, cuando ocurre el evento node.OnMouseClick se quede en hover (esperando), luego seguiré pasando el mouse por la lista y debe seguir funcionando como antes al pasar el mouse se pone en hover y al sacarlo se quita el over (mientras el li seleccionado siga en hover esperando otro clic).

Espero me entiendas.

Algo así es lo que quiero hacer... pero es la primera vez que programo en Javascript. Espero me entiendas lo que quiero hacer.
Sintáxis: [ Descargar ] [ Ocultar ]
Using javascript Syntax Highlighting
  1. if(!node.OnMouseClick){
  2.     node.onmouseout=function() {
  3.         this.className=this.className.replace(" over", "");
  4. }}
Coloreado en 0.000 segundos, usando GeSHi 1.0.8.4

Re: LI:HOVER en espera

NotaPublicado: 2009-08-11 19:36 @858
por explorer
Hace ya muchos años que no uso el IE ni nada que tenga que ver con productos Micro$oft, así que no puedo ayudarte en ese caso, salvo recomendarte que, si algo funciona en Firefox, es que está bien hecho, porque el motor de Firefox sí que sigue los estándares de presentación.

Ejemplos de lo que quieres hacer creo que hay unos cuantos, buscando por la red, en concreto, buscando por menús hechos con listas no ordenadas (<ul>). Por ejemplo, en esta página se da un ejemplo de convertir un <select> normal a un <ul> con las prestaciones de over, hover, y clic (selección) de un menú desplegable.

A ver si alguien más te puede ayudar...

Re: LI:HOVER en espera

NotaPublicado: 2009-08-12 12:54 @579
por kidd
Quizá te serviría el siguiente ejemplo:
http://www.scottdarby.com/plugins/stylish-select/0.3/

Es un plugin para que uses con JQuery.

Re: LI:HOVER en espera

NotaPublicado: 2009-08-12 14:15 @635
por chavelito
Gracias, logré solucionar mi problema con JQuery :D