Ver Mensaje Individual
  #1 (permalink)  
Antiguo 07/04/2014, 10:58
ecazorla
 
Fecha de Ingreso: abril-2014
Ubicación: Málaga
Mensajes: 13
Antigüedad: 10 años, 1 mes
Puntos: 0
Pregunta Botón con imagen mouseover

Hola!

Lo primero me presento, ya que es mi primer post aquí, soy de Málaga (España), tengo 23 años y espero participar activamente :)

Tengo un botón que esta formado por una imagen que al hacer mouseover cambia gradualmente a otra imagen para hacer un efecto de seleccionado.
El codigo es:

Código:
#facebook{height:40px;width:40px;margin: 0 5px;background-image:url(../imagenes/iconos/facebook.jpg); transition:all 0.3s;float:left;}
#facebook:hover{background-image:url(../imagenes/iconos/facebook-over.jpg);transition:all 0.3s;}

<div id="facebook">
    		<a href="#"><span style="display:none">Facebook</span></a>
</div>
El problema es que al señalar el botón, durante una fracción de tiempo (dependiendo de la conexión) el botón desaparece ya que está cargando la otra imagen. Una vez que la ha cargado ya el botón funciona con normalidad y hace el efecto perfectamente.

Como puedo hacer para evitar eso? Hay alguna forma de que la imagen para el mouseover ya esté cargada desde antes de señalar el botón?

Gracias y un saludo!