Cómo el código se va cargando por el orden en que está escrito, lo que haremos en esta ocasión será cargar primero de todo una capa con el aviso y justo al final del código (cuando se haya cargado todo), la hacemos invisible.
Para ello, justo después de <body> insertaremos el código de la capa:
<!-- DIV AVISO -->
<div id='aviso' style='text-align:center;margin:0px auto;position:absolute;left:20px;top:80px;width:136px;background-color:#eeeeee;border:1px #000000 solid;padding:5px;'>
<img style='display:block;margin:0px auto;' src='http://img38.imageshack.us/img38/8775/ajaxloader2h.gif'/>
<span style='font-family:Verdana;font-size:10px;font-weight:bold;color:#990000;'>Cargando datos.</span>
</div>
<div id='aviso' style='text-align:center;margin:0px auto;position:absolute;left:20px;top:80px;width:136px;background-color:#eeeeee;border:1px #000000 solid;padding:5px;'>
<img style='display:block;margin:0px auto;' src='http://img38.imageshack.us/img38/8775/ajaxloader2h.gif'/>
<span style='font-family:Verdana;font-size:10px;font-weight:bold;color:#990000;'>Cargando datos.</span>
</div>
Este es sólo un ejemplo y vuestra creatividad es la que decidirá qué poner dentro del DIV.
Lo único imprescindible es que tenga un ID (en el ejemplo aviso) y que lo recordemos, porque es el que necesitaremos a continuación.
Como decíamos, ahora al final del código colocamos estilo CSS para para que el anterior ID se vuelva no-visible. Por tanto, justo antes de </body>, tenemos que insertar:
<style type='text/css'>
#aviso {
visibility:hidden;
display:none;
}
</style>
#aviso {
visibility:hidden;
display:none;
}
</style>
Y eso es todo.
Este es un ejemplo de contenido sólo para lectores por feed.
CREDITOS A: black-fx
0 comentarios:
Publicar un comentario
GRACIAS POR COMENTAR:
NO se aceptan palabras vulgares, el ADMINISTRADOR de BLACK-FX se reserva los derechos a eliminar todos los comentarios vulgares.
ATTE.: EL ADMINISTRADOR IVAN.
¿Como Dejar Comentarios Con Enlace Clickeable?
EMOTICONOS:
:) : ) ;( ; ( :( : ( :P : P :D : D :$ : $;) ; ) :-I : -I :-X : -X :o : o :O : O