Precargas para imágenes con CSS

Este ejemplo no viene mucho al caso de ajax pero buscando encontre este que la verdad no sabia como se hacia pero siempre se aprende algo nuevo no importa si es un ejemplo antiguo.



No hay nada más fastidioso que una conexión a Internet lenta. Sobre todo cuando nuestros usuarios navegan con ella y a veces ni siquiera saben que falta cargar una imagen que quizás nos llevo tiempo editar para ese post. Pero si deseamos que nuestros usuarios logren ver todas las imágenes de nuestros post aun cuando naveguen con conexiones lentas, existe una forma muy fácil de decirles a nuestros usuarios de forma visual de que algo esta faltando cargar en nuestro post. Por ejemplo agregando una imagen visual que les hará saber que la imagen se esta cargando en el post y de esta forma acaben viendo de que trata esa imagen.

Para agregar de fondo la imagen de “precarga” a nuestras imágenes solo necesitaremos esta línea muy simple de CSS que deberemos agregar nuestra hoja de estilo.

img { background: url(loading.gif) no-repeat 50% 50%; }

Bueno espero que les sirva es muy sencillo de utilizar y nada despreciable.