Estilos CSS

ItNaS #1 Feb '05

Hola, tengo una duda y es que en la web http://www.dts-clan.com puse en la hoja de estilo el siguiente codigo:

}td:hover {
background-position:0 -100px;
}

de manera q cuando pasara el ratón por encima de la tabla, la imagen de fondo subiera 100 px.
Las imágenes q no me interesaba que subieran, las tuve que editar para que al pasar el ratón por encima no cambiara (Ejemplo: http://www.dts-clan.com/images/dig_temp2_01.png) Las que quería que cambiase, hice como si la bolita se iluminaba (quedando así la imagen: http://www.dts-clan.com/images/link_2.png).
He aquí acabo de hacer todo esto, compruebo q em sale bien y perfecto. Pero abro IE (uso mozilla)y no pasa nada. ¿Alguien sabe por qué pasa esto?

Whose #2 Feb '05 Penitente

En firefox funciona, en IE no funciona porque el hover solo funciona con los links, no con celdas ni divs, hace poco hice un codigo, no se si te servira pero prueba:
td a {
display:block;
}
td a:hover {
background-position:0 -100px;
}

yo lo uso en divs con <li> y mas codigo pero no se si con las tablas funcionara igual.

erdanblo #3 Feb '05 Inocente

Haber, yo lo tengo puesto una cosa similar, pero con Javascript, en vez de aplicarlo en la CSS directamente.

Seria, en el td que quieres cambiar algo así:

¬ index.html

¬ estilo.css

.defecto {
/* Como se mostraria la celda por defecto */
width: 10px;
}

.posicion1 {
/* Como se mostraria la celda al pasar el puntero por encima */
width: 30px;
}

.posicion2 {
/* Como quedaria, después de pasar el ratón por encima, lo más lógico, es que sea igual a "defecto" */
width: 10px;
}

Ej. www.reality-servers.com -> El menú.

Ah! Otra cosa, yo tengo una celda, y para contenido, lo tengo dentro de un DIV, pero vamos, yo creo que es lo mismo al final.

Es un efecto similar al de www.nggn.net, pero de otra manera.

No se si lo has entendido bien, si tienes algún problema preguntame.

guner #4 Feb '05

eso tiene facil arrego, dentro de las celdas donde están los botones, haz un div que ocupe todo el espacio de la celda, y dentro de este div pones los links.

y en el tag del div pones este código:
class="mOut" onmouseover="this.className='mHover'" onmouseout="this.className='mOut'"

x lo tanto:

para que esto funcione tienes que crear nuevas clases, que solo contengan la informacion del background

mOut : raton fuera
mHover: raton x encima

EDITADO : ¬.¬' encima de llegar tarde, no pongo código ...

erdanblo #5 Feb '05 Inocente

#4 A la vez, xDDDDDDDDDDDDDDDd... es lo mismo y todo no? xDDDDD

guner #6 Feb '05

sí, hemos pensado en lo mismo, pero tu has metido código y yo solo le he dado "una orientación" XD, pero yo habia metido divs ... la verdad no se xq

ItNaS #7 Feb '05

Nada, no hay manera, d ninguna forma q kk de IE

erdanblo #8 Feb '05 Inocente

:/ El código que yo di funciona con IE

Usuarios habituales