Foros Programación Cliente

Preguntilla CSS

8 8 Respuestas Martes 10 de agosto, 2004
Hola a todos!

He creado una lista con 'li', y no quiero utilizar href para crear los enlaces (<li><a href.....), lo que pasa es que me gustaria que al pasar el raton sobre el enlace (<li>enlace</li>) el texto cambie de color.

la pregunta: ¿hay alguna forma de conseguirlo sin tener que poner en cada <li> un onmouseover?, porque li:hover{color:red} no me funciona.

muuuuchas gracias!
Registrado desde 08/09/03
Número de posts: 40
  • Avatar de zigotica zigotica Registrado desde 10/05/04 / Número de posts: 1818
    1. ¿enlaces sin a href?
    2. si que funciona, pero no en IE. Para hackearlo (si crees que vale la pena) puedes probar este metodo
    Sergi
    z- dinavatar- fotos- !!!
    Publicado hace 8 años
  • Avatar de missha missha Registrado desde 29/08/03 / Número de posts: 354
    Seguramente lo estás probando en Internet Explorer, que solo soporta la pseudoclase hover para los elementos a. El resto lo hace bien, y soporta el hover para todos los elementos.

    Para solucionarlo en IE, mejor que utilizar un onmouseover, puedes usar un comportamiento HTC:
    http://www.xs4all.nl/~peterned/csshover.html

    o la técnica de IE7:
    http://dean.edwards.name/IE7/

    Espero que te sirva :)
    wolpy.com - camisetas de futbol - fieltro
    Publicado hace 8 años
  • Avatar de SELDON SELDON Registrado desde 08/09/03 / Número de posts: 40
    Si ya habia visto este enlace, pero es matar moscas a cañonazos,
    básicamente lo que quiero es que un texto dentro del <li> cambie de color cada vez que paso el raton encima de el, sin necesidad de un href ni de javascript (onmouseover).. vamos, que si se puede hacer en css

    muchas gracias por el enlace..
    Publicado hace 8 años
  • Avatar de joseflorido joseflorido Registrado desde 11/12/03 / Número de posts: 121
    si que se puede hacer con CSS :)

    simplemente con li:hover{}; pero IE no lo soporta :p

    sin comportamientos o sin javascript no conseguiras que IE lo haga :(

    saludos
    Publicado hace 8 años
  • Avatar de SELDON SELDON Registrado desde 08/09/03 / Número de posts: 40
    terminaré haciendolo con javascript, lo que pasa que en una lista de 40 y pico elementos tanto onmouseover y onmouseout es demasiado redundante...

    gracias!
    Publicado hace 8 años
  • Avatar de zigotica zigotica Registrado desde 10/05/04 / Número de posts: 1818
    automatizalo para IE (no lo escribas en el html) y deja el CSS para los demas. algo del estilo:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es">

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <meta http-equiv="imagetoolbar" content="no" />


    <title>test hover en IE via js</title>
    <link rel="SHORTCUT ICON" href="http://meddle.dzygn.com/favicon.ico" />

    <link rel='stylesheet' type='text/css' media='screen, tv' id='doubleplusgoodstyle' href='/css/gaudi.css' />

    <style type="text/css">
    li{color:red}
    li:hover{color:green}
    </style>
    <script type="text/javascript">

    var PUTOIE = {
    addLoadEvent : function (fn){
    var old = window.onload;
    if (typeof window.onload != 'function') {
    window.onload = fn;
    }
    else {
    window.onload = function() {
    old();
    fn();
    }
    }
    },

    asignaEvento : function(handlerNode){
    handlerNode.onmouseover = function() {
    handlerNode.style.color = "green";
    }
    handlerNode.onmouseout = function() {
    handlerNode.style.color = "red";
    }
    },

    init : function(tag, node)
    {
    alert("ie will start hacking hover");
    if(node) {if(typeof(node)=="string") node = document.getElementById(node);}
    else node = document;
    var tagARRAY = node.getElementsByTagName(tag);
    for (var k=0; k<tagARRAY.length; k++) {
    var tagELM = tagARRAY[k];
    PUTOIE.asignaEvento(tagELM);
    }
    }
    }

    window.onload=function(){alert("hi")}


    if (document.getElementById && document.getElementsByTagName && !window.getComputedStyle) {
    PUTOIE.addLoadEvent(function(){PUTOIE.init("LI", "capa");})
    }
    </script>
    </head>

    <body>




    <div id="capa">
    <ul>
    <li>hola</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    </ul>
    </div>


    </body>
    </html>
    Sergi
    z- dinavatar- fotos- !!!
    Publicado hace 8 años
  • Avatar de SELDON SELDON Registrado desde 08/09/03 / Número de posts: 40
    Gracias Zigotica, eres un monstruo, lo que pasa es que yo no puedo hacer "algo del estilo", lo digo porque solo he llegado al copiar/pegar....

    Me harias un gran favor si me dejas el codigo para insertarlo mi web (con un comentario hacia tí en el script, claro)....


    Muuuuchas gracias, en serio!
    Publicado hace 8 años
  • Avatar de zigotica zigotica Registrado desde 10/05/04 / Número de posts: 1818
    todo tuyo, añade el comentario si quieres en el codigo no hace falta que lo metas en la web, gracias de todos modos.

    de todos modos es mucho mas elegante usar el .htc si realmente quieres hover en IE.
    Sergi
    z- dinavatar- fotos- !!!
    Publicado hace 8 años