Re: [Ovillo] Efecto rollover con imagenes precargadas
Muuuchas gracias por la ayuda, quedo perfecto:
!--[if IE]
style
ul li a#idunico {
padding:65px 10px 5px 10px;
}
/style
![endif]--
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Efecto rollover con imagenes precargadas
Te aconsejo, que hagas situación de imagenes por css, que no necesita precarga (ya que es una única imagen que tiene dos dentro) te dejo un post de [1] rollover en CSS, no hace falta que uses javascript para el efecto hover, aunque en javascript también sea fácil hacerlo, ¿pero por que hacerlo menos accesible? [1] http://simplelogica.net/caoticoneutral/?p=26 Un saludo 2006/6/15, Alejandro Rojas [EMAIL PROTECTED]: No e podido encontrar un ejemplo, aunque sea en JS para hacer un efecto rollover con 2 imagenes, pero que la imagen se precarge, alguien tiene algun enlace? ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://ovillo.org/mailman/listinfo/ovillo ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Efecto rollover con imagenes precargadas
On 6/15/06, Coke Delta8 [EMAIL PROTECTED] wrote:
Te aconsejo, que hagas situación de imagenes por css, que no necesita
precarga (ya que es una única imagen que tiene dos dentro) te dejo un post
de [1] rollover en CSS, no hace falta que uses javascript para el efecto
hover, aunque en javascript también sea fácil hacerlo, ¿pero por que hacerlo
menos accesible?
[1] http://simplelogica.net/caoticoneutral/?p=26
Otra opción es cargar la segunda imagen como fondo de un elemento que
quede tapado.
Ej:
ul {
background: url(i/imagen-rollover.png);
}
li {
background: url(i/imagen.png);
}
li:hover {
background: url(i/imagen-rollover.png);
}
Suponiendo que los `li` tapen por completo el `ul`, tendrías una
imagen precargada que _no_ sería visible.
Salud.
--
Choan
Un saludo
2006/6/15, Alejandro Rojas [EMAIL PROTECTED]:
No e podido encontrar un ejemplo, aunque sea en JS para hacer un efecto
rollover con 2 imagenes, pero que la imagen se precarge, alguien tiene
algun
enlace?
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Efecto rollover con imagenes precargadas
Alejandro Rojas escribió: No e podido encontrar un ejemplo, aunque sea en JS para hacer un efecto rollover con 2 imagenes, pero que la imagen se precarge, alguien tiene algun enlace? ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://ovillo.org/mailman/listinfo/ovillo Lo que yo hago es usar una sola imagen que contenga los dos estados del boton, como te dice Coke. Puedes ver un tutorial que hice sobre eso aqui http://www.cristalab.com/tutoriales/130/crear-menus-de-navegacion-en-css-usando-listas Es muy facil y funciona en todos los casos. ___ Lista de distribución Ovillo Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Efecto rollover con imagenes precargadas
Ramon, segui tu ejemplo, los anteriores tambien funcionaron pero necesitaba
dejar todo en una lista es por eso que el tuyo me resulto mejor, ahora tengo
un pequeño problema, este es el css que estoy usando:
ul li a#idunico {
display:block;
width:65px;
padding:65px 10px 5px 10px;
text-decoration:none;
background-image:url(datos/img/agricolas_l_o.jpg);
}
ul li a:hover#idunico {
color:#00;
background-position: 0 -85px;
}
y el html:
ul
lia id=idunico href=pagina.html/a/li //no pude ocultar
el span en IE
lia id=idunico href=pagina.html/a/li
/ul
uso una imagen de 85x170
un estado equivale a 85x85 aprox.
Bueno, mi problema es que en IE se ve perfecto, pero en Firefox la barte de
abajo del boton se ve cortada
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://ovillo.org/mailman/listinfo/ovillo
Re: [Ovillo] Efecto rollover con imagenes precargadas
Alejandro Rojas escribió:
Ramon, segui tu ejemplo, los anteriores tambien funcionaron pero necesitaba
dejar todo en una lista es por eso que el tuyo me resulto mejor, ahora tengo
un pequeño problema, este es el css que estoy usando:
ul li a#idunico {
display:block;
width:65px;
padding:65px 10px 5px 10px;
text-decoration:none;
background-image:url(datos/img/agricolas_l_o.jpg);
}
ul li a:hover#idunico {
color:#00;
background-position: 0 -85px;
}
y el html:
ul
lia id=idunico href=pagina.html/a/li //no pude ocultar
el span en IE
lia id=idunico href=pagina.html/a/li
/ul
uso una imagen de 85x170
un estado equivale a 85x85 aprox.
Bueno, mi problema es que en IE se ve perfecto, pero en Firefox la barte de
abajo del boton se ve cortada
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://ovillo.org/mailman/listinfo/ovillo
Bueno, eso se debe a que IE suele sumar la altura del texto al boton,
mientras que FF y otros no lo hacen. Intenta poner un condicional para
IE con la medida que tienes ahorita, y antes de eso pones la medida
necesaria para que FF lo ponga bien.
___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://ovillo.org/mailman/listinfo/ovillo
