PROBLEMAS CON CAPAS Y IMAGEN DE SUSTITUCION

[Panshitu]

Hola warianos, como estan.

Tal como dice el tema, tengo problemas, estoy trabajando en Dreamweaver8 y solo trabajo con capas.

TEngo un fondo que esta complementado por capas que son el manu en un lado de esta.

Cuando apreto un boton del menu , por ejemplo contactanos, aparece sin ningun problema la capa de Contactanos.

Pero cuando agrego imagenes de sustitucion a este capa Contactanos, no funcionan. Son como imagenes no mas.

El fondo de pantalla que esta enlazado con el menu esta con position: fixed; para que cuando yo aprete un boton del menu aparezca lo que estoy pidiendo, y en el momento de mover la barra solo se mueva lo que aparece y no la pagina completa, es decir el fondo queda estatico.

 

Bueno eso, necesito saber como hago para que las imagenes de sustitucion de la parte de contactos funcione, ya que se ven solo como imagen y al pasarle el mouse por encima no tiene ningun movimiento

 

 

ESTA ES LA IMAGEN PARA QUE LA VEAN

 

Ahi pueden ver que el menu discoteque funciona a la perfeccion pero cuando intento que la imagen de sustitucion en este caso oasis discoteque funcione, no funciona.

 

RUEGO UNA AYUDA PORFAVOR.

Edited July 13, 2011 by Panshitu

[rkstro]

Mira no tengo idea a lo que te refieres con imagenes de sustiucion.

 

Pero hacer que al poner el mouse encima cambie la imagen de fondo es super facil de hacer con CSS, para ello suponiendo que la capa tiene como id capa el CSS queda:

#capa { backgroud-image: url(path/to/imagenA.jpg); }
#capa:hover { backgroud-image: url(path/to/imagenB.jpg); }

 

Entonces, de manera normal se vera la imagenA.jpg y cuando se ponga el mouse encima se vera imagenB.jpg

[Panshitu]

claro, si eso eso.. pero el problema es que tengo una #capaFondo y una #capaDiscoteque.

la #capaFondo siempre es visible y en el momento en que quiero que estas imagenes de sustitucion ( que es cuando pasas el mouse por arriba cambia la imagen y tiene un hipervinculo) de la #capaDiscoteque funcionen no funcionan porque como lo mencione la #capaFondo esta todo el rato a la vista. Cuando pongo la #capaDiscoteque sobre la #capaFondo las imagenes de sustitucion funcionan bien, pero la pagina no se ve correctamente. Me entiendes ahora? Como que en el momento de hacer correr la pagina de forma correcta, funcionan las imagenes de sustitucion, que seria el menu, pero en la #capaDiscoteque no funcionan las imagenes de sustitucion.

 

[rkstro]

claro, si eso eso.. pero el problema es que tengo una #capaFondo y una #capaDiscoteque.

la #capaFondo siempre es visible y en el momento en que quiero que estas imagenes de sustitucion ( que es cuando pasas el mouse por arriba cambia la imagen y tiene un hipervinculo) de la #capaDiscoteque funcionen no funcionan porque como lo mencione la #capaFondo esta todo el rato a la vista. Cuando pongo la #capaDiscoteque sobre la #capaFondo las imagenes de sustitucion funcionan bien, pero la pagina no se ve correctamente. Me entiendes ahora? Como que en el momento de hacer correr la pagina de forma correcta, funcionan las imagenes de sustitucion, que seria el menu, pero en la #capaDiscoteque no funcionan las imagenes de sustitucion.

 

Por lo que dices deduzco que tienes mal planteada la pagina y hay cosas que probablemente estas haciendo de manera incorrecta.

La #capaFondo que dices es como el fondo del sitio o fondo de algo particular? si es el fondo del sitio no veo porque usas una capa y no aplicas el fondo a body.

 

Lo otro lo que yo te mencione denante, donde se hace uso de la pseudo clase :hover, se activa cuando el mouse esta sobre el elemento, y si tienes una capa que esta sobre otra ( es decir capa2 sobre capa1, por ej) si yo pongo el mouse sobre capa1, no se activa el hover porque capa2 esta primero, por lo que si o si capa1, para que funcione el hover, tiene que estar sobre capa2.

 

Asi que debes replantearte como estas haciendo el sitio creo yo, lo otro lee sobre el uso de la propiedad z-index, me parece que eso podria ayudarte.

[Ra]

Si las capas están superpuestas y ambas con display: block... con JQuery

$("#capaFondo").hover(function(){ $(this).fadeOut(500); }, function(){ $(this).fadeIn(500); });

 

;)

 

Salu2.

[chuck]

Si no posteas el codigo dificilmente podamos ayudarte...

 

Ahora respecto al problema... mm... totalmente de acuerdo por lo del fondo... no me hace sentido poner el fondo a una capa. hay que ponerlo al body, y posicionarlo con background-position:top center; (el top center bottom... etc.. depende de lo que necesites) asi te ahorras el lio de los z-index.

 

El menu, yo lo haria usando sprites. No es necesario hacer una imagen para cada estado, puedes hacer una sola con todos los botones, estados, y solo mueves su posicion, ya sea con coordenadas relativas (top, left, center, right, bottom), o dando coordenadas en pixeles. Cargas menos imagenes, y el tiempo de respuesta es mejor.

 

 

Saludos

Edited July 25, 2011 by chuck