Objetivo: Señalar enlace y que cambie el fondo.

[MeneXe]

Hola, lo que quiero hacer es que cambie la imagen de fondo al señalar el enlace, hice un tabla con css del tamaño de la imagen que tengo lista para que sea el nuevo fondo, no se como hacer para que cambie al ser señalado el enlace.


Se que es algo muy básico pero no lo encuentro :S

Recuerden, señalar un vinculo y que cambie la imagen de fondo.


Gracias! espero ansioso

[Aresillo]

Mira esto:
Rollover con imagen de fondo...

Un saludo!!

Aresillo!!

[MeneXe]

Iniciado por Aresillo

Mira esto:
Rollover con imagen de fondo...

Un saludo!!

Aresillo!!

Gracias Man! te pasaste!

[MeneXe]

Bueno, igualmente no me sale. tengo esto mira...

#apDiv2 {
position:absolute;
left:220px;
top:462px;
width:122px;
height:59px;
z-index:2;

;
}


y despues esto...

<div id="apDiv2"><a href="www.google.com.ar">sdd</a></div>


¿Como hago entonces? Que codigo tengo que añadir y donde...

Me mandaste el menu completo que va con "li" etc.. y la verdad me re confunde, yo simplemente tengo todo separadito, no se despliega nada, usé el dreamweaver con la herramienta "Dibujar Div PA" .

Hice un rectangulo del tamaño de la imagen que tengo para fondo al ser señalado.

¿Que tengo que hacer? Gracias

[David]

El "código mágico" que lo hace en el ejemplo en araudi.net ( hola Mikmoro) es este:

Código css:

.menusup li a:hover {color:#fff;
background:#000 url(../img/cambio.gif);
}
 

Fíjate que usa la pseudoclase "hover" (al estar el puntero del ratón encima del enlace) para cambiar el fondo (background).

[Aresillo]

Pues es que depende un poco de varias cosas...
Yo te recomendaría que la imagen de background y la que aparecerá cuando tienes el ratón encima sean igual para todos los links del menú...
Sino, es un lío para que cuadre todo...(yo ahora estoy con uno... y es un poco matada...)

Lo mejor que puedes hacer es tener los links del menú en una lista porque en realidad, son una lista, ya sea vertical u horizontal... así que mejor que tenerlos separaditos mételos en una lista...
Además, es más fácil cambiar cosas...

Dime si es un background y un background cuando te pones encima por imagen o si son iguales para todos...

Un saludo..

Aresillo!!

[MeneXe]

sigo sin entender bien...

Lo que tengo es diferentes "divs" para cada link, y en cada link quiero que al señalar cambie el fondo de ese "div".

El anterior fondo (sin señalar) quedaria transparente.

Pero al señalar con una imagen. No se como hacerlo

[Aresillo]

Pues lo que tienes que hacer se base en lo que ya te ha dicho david..
Hover significa "cuando poner el ratón encima de la palabra" asi que tienes que utilizar dicha propiedad...

En tu ejemplo tienes el div:

Código:

<div id="apDiv2"><a href="www.google.com.ar">sdd</a></div>

Y el código CSS:

Código:

#apDiv2 {
position:absolute;
left:220px;
top:462px;
width:122px;
height:59px;
z-index:2;
background: url(ruta a la imagen de fondo);
}

A este código le tienes que poner un background, te lo he puesto en negrita


Lo que te falta para aplicarlo es esto:

Código:

#apDiv2 a:hover {
background: url(ruta a la imagen de fondo cuando pones el ratón encima);
}

Lo que le dices es que el enlace, al pasar el ratón por encima utilice ese fondo.
También puedes decirle que al pasar por encima cambie el color de la letra:
color:#xxxxxx;
Que se subraye o no:
text-decoration: underline o none respectivamente

Y lo que se te ocurra..

Un saludo!

Aresillo!!

[MeneXe]

Iniciado por Aresillo

Pues lo que tienes que hacer se base en lo que ya te ha dicho david..
Hover significa "cuando poner el ratón encima de la palabra" asi que tienes que utilizar dicha propiedad...

En tu ejemplo tienes el div:

Código:

<div id="apDiv2"><a href="www.google.com.ar">sdd</a></div>

Y el código CSS:

Código:

#apDiv2 {
position:absolute;
left:220px;
top:462px;
width:122px;
height:59px;
z-index:2;
background: url(ruta a la imagen de fondo);
}

A este código le tienes que poner un background, te lo he puesto en negrita


Lo que te falta para aplicarlo es esto:

Código:

#apDiv2 a:hover {
background: url(ruta a la imagen de fondo cuando pones el ratón encima);
}

Lo que le dices es que el enlace, al pasar el ratón por encima utilice ese fondo.
Tienes puedes decir que al pasar por encima cambie el color de la letra:
color:#xxxxxx;
Que se subraye o no:
text-decoration: underline o none respectivamente

Y lo que se te ocurra..

Un saludo!

Aresillo!!

Esa es la respuesta que necesitaba!!!!!!!! :D!!!

1.000.000 de gracias!!!!!! :D, buenisimo, de verdad, muchisisisimas gracias, ahora entendi ^^.

Habia visto un ejemplo pero no entendia bien si se repetia el "div" o que... ahora veo que eso expecifica los detalles del "a" (enlace) del "div" "x".

Muchas gracias :)