Ir para conteúdo
Fórum Script Brasil
  • 0

Barra De Progressão

Pilantra

Perguntado por Pilantra,

 Share

Pergunta

Pilantra

Pilantra

Postado
Postado

Olá povo

Como se faz uma barra de progresso, enquanto carrega a página principal?!?! Tipo igual aqueles do Flash, que fica uma menssagem de aguarde, e uma barra carregando conforme a página é carregada!!!!! Mas eu queria aprender a fazer isso, se alguém puder me explicar ou me postar um código bem fácil de aprender eu agradeceria pra caramba!! laugh.gif

Muito obrigado

T+

Pilantra blink.gif

Link para o comentário
Compartilhar em outros sites

8 respostass a esta questão

Posts Recomendados

  • 0
diraol

diraol

Postado
Postado

cara......... mas isso é flash num é não?!?!?!

eu achu q até já vi em JS, mas num tenho a menor idéia de onde....hehehehehe

talvez você ache em sites como www.scriptfacil.com.br (ou algo assim)......

Link para o comentário
Compartilhar em outros sites
  • 0
diraol

diraol

Postado
Postado

é complicado.... porque o JS não é dinâmico pra saber qtos % estão vindo e tals.... entendes???????

por isso q eu num sei se é possível....

Link para o comentário
Compartilhar em outros sites
  • 0
diraol

diraol

Postado
Postado

cara, existem vários tutos de flash pra pre-loadaers por ai..... e outra, o pessoal aki do fórum vai conseguir te ajudar numa boa... biggrin.gif

mas dá uma olhada no PHP, talvez seja possível, num sei..........

com JS eu tenho uma vaga lembrança q vi algo uma vez, aqui no fórum mesmo.... dá uma olhada, faz uma busca legal..... ps.: fica esperto no tempo da busca... faça para os ultimos 360 dias......

Link para o comentário
Compartilhar em outros sites
  • 0
Mateustg

Mateustg

Postado
Postado

Ai Pilantra!

Tem este código aqui, você deve colocar o código de progressão e junto outro código de mudança de página, ah! mas não sei se serve.

Progressão:

<html>
<body>
<head>

<!------------COMEÇA AQUI------------->

<table align="center"><tr><td>
<div style="font-size:8pt;padding:2px;border:solid black 1px">
<span id="progress1">&nbsp; &nbsp;</span>
<span id="progress2">&nbsp; &nbsp;</span>
<span id="progress3">&nbsp; &nbsp;</span>
<span id="progress4">&nbsp; &nbsp;</span>
<span id="progress5">&nbsp; &nbsp;</span>
<span id="progress6">&nbsp; &nbsp;</span>
<span id="progress7">&nbsp; &nbsp;</span>
<span id="progress8">&nbsp; &nbsp;</span>
<span id="progress9">&nbsp; &nbsp;</span>
</div>
</td></tr></table>
<script language="javascript">
var progressEnd = 9;  
var progressColor = 'blue';	
var progressInterval = 1000;

var progressAt = progressEnd;
var progressTimer;
function progress_clear() {
	for (var i = 1; i <= progressEnd; i++) document.getElementById('progress'+i).style.backgroundColor = 'transparent';
	progressAt = 0;
}
function progress_update() {
	progressAt++;
	if (progressAt > progressEnd) progress_clear();
	else document.getElementById('progress'+progressAt).style.backgroundColor = progressColor;
	progressTimer = setTimeout('progress_update()',progressInterval);
}
function progress_stop() {
	clearTimeout(progressTimer);
	progress_clear();
}
progress_update();	
</script>
<!---------------TERMINA AQUI--------------------->

</BODY></HTML>
Mudança de pág.: 
<html>
<head>




<body bgcolor="#3366cc" text="#FFFFFF">
<div id="splashcontainer" style="position:absolute;width:350"></div>

<layer id="splashcontainerns" width=729 height="19"></layer>

<script>

var intervals=500
var targetdestination="paginadois.html"

var splashmessage=new Array()
var openingtags='<font face="Verdana" size="2" color=white><b>'
splashmessage[0]="carregando site- Processando 5%"
splashmessage[1]="carregando site- Processando 10%"
splashmessage[2]="carregando site- Processando 15%"
splashmessage[3]="carregando site- Processando 20%"
splashmessage[4]="carregando site- Processando 25%"
splashmessage[5]="carregando site- Processando 30%"
splashmessage[6]="carregando site- Processando 35%"
splashmessage[7]="carregando site- Processando 40%"
splashmessage[8]="carregando site- Processando 45%"
splashmessage[9]="carregando site- Processando 50%"
splashmessage[10]="carregando site- Processando 55%"
splashmessage[11]="carregando site- Processando 60%"
splashmessage[12]="carregando site- Processando 65%"
splashmessage[13]="carregando site- Processando 70%"
splashmessage[14]="carregando site- Processando 75%"
splashmessage[15]="carregando site- Processando 80%"
splashmessage[16]="carregando site- Processando 85%"
splashmessage[17]="carregando site- Processando 90%"
splashmessage[18]="carregando site- Processando 95%"
splashmessage[19]="carregando site- Processado 100%"
splashmessage[20]="carregamento completo"
var closingtags='</font>'

var i=0

function displaysplash_ie(){
if (i<splashmessage.length){
sc_ie.style.visibility="hidden"
sc_ie.innerHTML='<b><center>'+openingtags+splashmessage[i]+closingtags+'</center></b>'
sc_ie.style.top=document.body.scrollTop+document.body.clientHeight/2-sc_ie.offsetHeight/2
sc_ie.style.visibility="visible"
i++
}
else{
window.location=targetdestination
return
}
setTimeout("displaysplash_ie()",intervals)
}

function displaysplash_ns(){
if (i<splashmessage.length){
sc_ns.visibility="hide"
sc_ns.document.write('<b>'+openingtags+splashmessage[i]+closingtags+'</b>')
sc_ns.document.close()

sc_ns.left=pageXOffset+window.innerWidth/2-sc_ns.document.width/2
sc_ns.top=pageYOffset+window.innerHeight/2-sc_ns.document.height/2

sc_ns.visibility="show"
i++
}
else{
window.location=targetdestination
return
}
setTimeout("displaysplash_ns()",intervals)
}



function positionsplashcontainer(){
if (document.all){
sc_ie=document.all.splashcontainer
sc_ie.style.left=document.body.scrollLeft+document.body.clientWidth/2-sc_ie.offsetWidth/2
sc_ie.style.top=document.body.scrollTop+document.body.clientHeight/2-sc_ie.offsetHeight/2
displaysplash_ie()
}
else if (document.layers){
sc_ns=document.splashcontainerns
sc_ns.left=pageXOffset+window.innerWidth/2-sc_ns.document.width/2
sc_ns.top=pageYOffset+window.innerHeight/2-sc_ns.document.height/2
sc_ns.visibility="show"
displaysplash_ns()
}
else
window.location=targetdestination
}
window.onload=positionsplashcontainer

</script>


</body>
</html>

Junte os dois script na mesma página e vera que o carregamento irá funcionar, juntamente com a barra.

Link para o comentário
Compartilhar em outros sites
  • 0
Ricardo Cobain

Ricardo Cobain

Postado
Postado

Hahahaha..., e possivel sim e eu vou provar isso!

O codigo:

<html>

<head>

<body>

<!---Webdesigner:Ricardo Cobain---->

<!---HomePage:http://universoalfa/--->

<script language="JavaScript" type="text/JavaScript">

<!--

function MM_preloadImages() { //v3.0

  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();

    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)

    if (a.indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a;}}

}

function MM_openBrWindow(theURL,winName,features) { //v2.0

  window.open(theURL,winName,features);

}

function MM_displayStatusMsg(msgStr) { //v1.0

  status=msgStr;

  document.MM_returnValue = true;

}

//-->

<!--

function mOvr(src,clrOver) {

if (!src.contains(event.fromElement)) {

  src.style.cursor = 'hand';

  src.bgColor = clrOver;

}

}

function mOut(src,clrIn) {

if (!src.contains(event.toElement)) {

  src.style.cursor = 'default';

  src.bgColor = clrIn;

}

}

function mClk(src) {

if(event.srcElement.tagName=='TD'){

src.children.tags('A')[ 0].click();

}

}

// -->

</script>

<script language="vbscript">

<!--

Dim Bar, Line, SP

Bar = 0

Line = "||"

SP = 100

Function Window_onLoad()

Bar = 95

SP = 10

End Function

Function Count()

If Bar < 100 Then

Bar = Bar + 1

Window.Status = "Aguarde Carregando ...." & Bar & "%" & " " & String(Bar, Line)

setTimeout "Count()", SP

Else

Window.Status = "® Concluido"

Document.Body.Style.Display = ""

End If

End Function

Call Count()

-->

</script>

</html>

Isso gerará um efeito de loding do status com um efeito de barras muito louco

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.

×
 Share
Ir para lista de Perguntas


  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,3k
×
×
  • Criar Novo...