Foros del Web » Creando para Internet » CSS »

Integrar rollover CSS

Estas en el tema de Integrar rollover CSS en el foro de CSS en Foros del Web. Estoy probando un rollover css como el explicado en http://ervdesign.net/blog/?p=88 . Cuando lo ensayo como contenido único de un documento html el resultado es perfecto, ...
  #1 (permalink)  
Antiguo 19/02/2008, 05:34
 
Fecha de Ingreso: junio-2007
Mensajes: 492
Antigüedad: 10 años, 5 meses
Puntos: 8
Integrar rollover CSS

Estoy probando un rollover css como el explicado en http://ervdesign.net/blog/?p=88. Cuando lo ensayo como contenido único de un documento html el resultado es perfecto, pero si trato de incluirlo en una página que ya tiene su propio código, no logro que se muestre la imagen ni antes ni después de pasar el cursor. Eso sí, el enlace funciona, pues al clicar sobre el espacio en blanco en el que debiera estar la foto, el link lleva al documento prefijado como destino.

He pensado que esto puede deberse a dos causas:

* en la cabecera de la página aplico un estilo a los enlaces de la misma, concretamente quitar el subrayado y especificar los colores de a y a:hover Justo bajo esa parte del código pongo el del rollover css tal y como figura en el tutorial. ¿Tendría que retocar algo ahí?

* No obstante lo dicho arriba, creo que la cosa tiene quizá más que ver con
la ruta de la imagen. Lo que en el ejemplo es url(img/foto.jpg), ¿tendría que ser
en mi caso url(../imagenes/foto.jpg) o algo parecido?
  #2 (permalink)  
Antiguo 19/02/2008, 16:50
 
Fecha de Ingreso: febrero-2008
Mensajes: 62
Antigüedad: 9 años, 9 meses
Puntos: 1
Re: Integrar rollover CSS

De acuerdo a tus preguntas:

1. No deberia existir problemas con esas reglas CSS que dices aplicas a los links al principio, puesto que el dicho "efecto" trabaja en base a su propia clase .rollover, y es un simple cambio de posicionamiento de la imagen de fondo.

2. Ese deberia ser el problema. Si no se muestra la imagen, entonces es que la estas "llamando" desde un path incorrecto. El mismo deberia ser de acuerdo a donde tienes la imagen.
Eso, pues, no te podriamos ayudar porque habria que saber la ubicacion de la imagen en el sitio.

Avisanos. :)
  #3 (permalink)  
Antiguo 20/02/2008, 05:43
 
Fecha de Ingreso: junio-2007
Mensajes: 492
Antigüedad: 10 años, 5 meses
Puntos: 8
Re: Integrar rollover CSS

Gracias por tu respuesta, Cleft. Sí, yo también me inclino a pensar que ése debe de ser el problema, la ruta para enlazar la imagen. La he revisado y parece correcta, por lo que el asunto me tiene intrigado; no obstante voy a revisarlo todo de nuevo por si acaso. Normalmente, la ruta de una imagen suele ser algo así como ../imagenes/foto.jpg ¿Es acertado escribir url(../imagenes/foto.jpg) en el caso que planteo? Lo pregunto porque a veces basta un error mínimo en el código para que la imagen no se vea...
  #4 (permalink)  
Antiguo 20/02/2008, 11:23
 
Fecha de Ingreso: febrero-2008
Mensajes: 62
Antigüedad: 9 años, 9 meses
Puntos: 1
Re: Integrar rollover CSS

Pues, no es normalmente. Todo depende, como te dije antes, de la ubicacion de la misma.

Si tu imagen esta ubicada en el mismo directorio del CSS, suficiente con llamarla con:
(foto.jpg)

Si esta en un nivel arriba del directorio donde se encuentra el archivo CSS:
(../foto.jpg)

Y asi sucesivamente.

Lo que puedes probar para salir de dudas es escribiendo todo el URI de la imagen, ej:
url(http://tuwebsite.com/imagenes/foto.jpg)

Y si te trabaja, entonces sabras que has escrito mal el path de la imagen en tus pruebas anteriores.
  #5 (permalink)  
Antiguo 20/02/2008, 11:31
 
Fecha de Ingreso: junio-2007
Mensajes: 492
Antigüedad: 10 años, 5 meses
Puntos: 8
Re: Integrar rollover CSS

Gracias de nuevo, lo haré así como dices y postearé el resultado.
  #6 (permalink)  
Antiguo 21/02/2008, 05:02
 
Fecha de Ingreso: junio-2007
Mensajes: 492
Antigüedad: 10 años, 5 meses
Puntos: 8
Re: Integrar rollover CSS

Ya está solucionado, todo se debía a un pequeño error: tras la dirección url de la imagen -dato que se incluye dos veces a lo largo del código-, en una de ellas faltaba el guión de no-repeat. Sin embargo, y para no desaprovechar tu consejo, Cleft, lo ensayé luego varios veces, y no cabe duda de que es la mejor alternativa para casos de ruta dudosa.

Gracias y un saludo.
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 10:48.