Fóruns sobre PHP, JavaScript, HTML, MySQLi, jQuery, Banco de Dados, CSS


Moderador: web

 
Avatar do usuário
ADMIN
ADMIN
Tópico Autor
Mensagens: 17416
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Barra de carregamento

10-12-2007 20:03

Esse script mostra quantos porcento falta para o carregamento da página, como um dos objetos mais pesados em um documento são figuras, o script toma como base eles.

CSS

<style type="text/css"> div#loading_parent { width: 200px; border: 1px solid black; } div#loading_bar { width: 0; background-color: green; } </style>

JAVASCRIPT
<script type="text/javascript"> var img_interval; function erase() { document.getElementById("loading_text").style.display = "none"; document.getElementById("loading_parent").style.display = "none"; }   function startCheck() { img_interval = setInterval("checkImages()", 10);   } function checkImages() { var imgs = document.getElementsByTagName("img");   var total = imgs.length;   var num_loaded = 0; var i; for(i=0; i<total; i++) { if(imgs[i].complete)   num_loaded++;   } var per_cent = (num_loaded / total) * 100;   var per_cent = Math.round(per_cent); document.getElementById("loading_bar").style.width = per_cent + "%";   if(num_loaded == total) { clearInterval(img_interval); document.getElementById("loading_text").innerHTML = "completo"; setTimeout("erase()", 1000); } else { document.getElementById("loading_text").innerHTML = per_cent+"%"; } } </script> <script language="javascript">startCheck();</script>

HTML
<span id="loading_text" style="display:block;">0%</span> <div id="loading_parent"> <div id="loading_bar">&nbsp;</div> </div>


<img src="suafigura.jpg" onerror="this.src='nocasodeerromostraessa.jpg'">

Note que no img tem o onerror, é importante que você sete uma figura caso não seja encontrada a imagem original.
1
Tem um script legal em HTML, CSS, PHP, HTML, JavaScript, jQuery? Poste e compartilhe com os usuários do fórum :rock:

Quem está online

Usuários navegando neste fórum: Nenhum usuário registrado