Hola a todos hoy les traigo otro hermoso gadget, lo encontre en Cuidad Blogger, la verdad que me intereso, pero no tenia algo que le pusiera esa chispa, asi que yo lo puse!
Caracteristicas
- Imagen desaparece una vez terminado de cargar tu blogger.
- Es totalmente editable el color de fondo la imagen etc.
- Esta centrado en medio de entradas y el blog.
Implementar a tu blogger
Vamos a Plantilla | Edición de HTML y antes de </head> pegamos lo siguiente:
Guardamos los cambios y vamos a Diseño | Elementos de la página y en un elemento HTML/Javascript pegamos lo siguiente:
DEMO:
Caracteristicas
- Imagen desaparece una vez terminado de cargar tu blogger.
- Es totalmente editable el color de fondo la imagen etc.
- Esta centrado en medio de entradas y el blog.
Implementar a tu blogger
Vamos a Plantilla | Edición de HTML y antes de </head> pegamos lo siguiente:
- Código:
<script type='text/javascript'>
window.onload = detectarCarga;
function detectarCarga(){
document.getElementById("imgLOAD").style.display="none";
}
</script>
Guardamos los cambios y vamos a Diseño | Elementos de la página y en un elemento HTML/Javascript pegamos lo siguiente:
- Código:
<style type="text/css">
#imgLOAD {
background-color: #EEEEEE; /* Color de fondo */
width: 250px;
padding-top:5px;
padding-bottom:25px;
text-align: center;
/* POSICION FLOTANTE */
position:fixed !important;
right:50%; /* Esto decide Izquierda o derecha 5% */
top:50%; /* Distancia de arriba para abajo */
z-index:10 !important
/* POSICION FLOTANTE */
/* REDONDEADO */
-moz-border-radius: 15px 15px 15px 15px;
-webkit-border-radius: 15px 15px 15px 15px;
border-radius: 15px 15px 15px 15px;
/* REDONDEADO */
border:-color: #000000;
border-width: 2px;
border-style: solid;
}
</style>
<div class="imgLOAD" id="imgLOAD">
<div align="center"><a href="http://blogger.superforo.net/t13-imagen-cargando-desaparece-al-cargar-completamente" target="_blank"><img src="http://1.bp.blogspot.com/-QnTbXSOlL7Y/UWHw4hJVPSI/AAAAAAAAHM0/LrRlbgyyN2M/s1600/Gadgets.png" border="0"></a></div>
<img src="http://s3.argim.net/files/s/cargando_contenido.gif" /></div>