Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Felipe Torres

Carregar o site antes de exibir.

Por , em Javascript

Recommended Posts

Felipe Torres    1

Felipe Torres
Postado

Galera,

 

quero carregar o site todo antes de abrir, porque um cliente falo quie esta demorando pra carregar.

 

Tenho uma animação em flash e deve ser por isso que ela esta reclamando da demora.

 

se alguem poder me ajudar a fazer um "PRELOADER". vlw

 

obrigado

Compartilhar este post

Link para o post
Compartilhar em outros sites

hantaro    1

hantaro
Postado

Olha nao sei se resolve muito, mas voce pode colocar uma <div> com position:absolute e largura e altura 100%, e dentro dessa div, colocar algo de carregando e tal, ou uma imagem, introdução. Tambem bloqueia os scroll da tela.

 

No body voce coloca um onload chamando um função que libera os scroll da pagina e faz essa div sumir, pois o body so vai executar essa função quando tudo tiver carregado, incluindo imagens.

 

Por exemplo,deixa seu css assim: (isso vai tirar os scroll da pagina)

 

body{overflow-x:hidden;overflow-y:hidden;}

e cria uma div que vai bloquear a pagina

 

<div id="bloquear" style="position:absolute;top:0;left:0;width:100%;height:100%; background:#333;"></div>

e sua função ficaria mais ou menos assim

 

function liberar(){
	document.getElementById('bloquear').style.display='none';
	document.body.style.overflow='scroll';
}

Agora é so chamar a função no onload do <body>

NOTA: não sei se vai funcionar devido ao flash, mas com um site com html e imagens puro eu sei que funciona

Compartilhar este post

Link para o post
Compartilhar em outros sites

Felipe Torres    1

Felipe Torres
Postado 

body{overflow-x:hidden;overflow-y:hidden;}

<div id="bloquear" style="position:absolute;top:0;left:0;width:100%;height:100%; background:#333;"></div>


function liberar(){
	document.getElementById('bloquear').style.display='none';
	document.body.style.overflow='scroll';
}

Então eu coloquei mais nao deu certo, ou ta carregando muito rápido.

Vou passar meu código pra dar uma olhada.

 

body {
 	position:absolute;
	left:50px;
	overflow-x:hidden;
	overflow-y:hidden;
	}
	
</style>
<style type="text/javascript">
function liberar(){
	document.getElementById('bloquear').style.display='none';
	document.body.style.overflow='scroll';
}
</style>
</head>
<body onload="liberar">
<div id="bloquear" style="position:absolute;top:0;left:0;width:100%;height:100%; background:#FFFFF;"></div>

Compartilhar este post

Link para o post
Compartilhar em outros sites

hantaro    1

hantaro
Postado

Bom o css voce deve deixar assim:

 

<style type="text/css">
body {overflow-x:hidden;overflow-y:hidden;}
<style>

define uma cor escura pra div pra ficar melhor pra testar, tipo #333

 

e o script deve ficar dentro do <script type="text/javascript"> e nao <style type="text/javascript">

 

no <body> chame a função assim onload="liberar();"

 

Pra testar esperimenta colocar uma 20 imagens com resolução 1024 na pagina pra voce ver.

Compartilhar este post

Link para o post
Compartilhar em outros sites

vidaloukaig    0

vidaloukaig
Postado

Opa, opa, opa... Nem fui tão feliz assim até abrir o Internet Explorer. Aquele navegador que nos amamos tanto, né? O I.E. é tão esperto que ele gera os scrolls no quadro geral da div... O meu layout tem várias divs... E olha como esse script ta rodando no IE:

 

Imagem Postada

 

Imagem Postada

 

No Firefox tudo funciona maravilhosamente bem, o mundo inteiro poderia usar o firefox, seria uma bensa...

 

No Chrome esse script ta "destruindo" todas as outras páginas, porque elas simplesmente "perdem" as barras de rolagem, com exceção da index que funciona direito... (eu acho que se colocar onload="liberar();" em todas as páginas o Chrome vai liberar a rolagem... mais obviamente essa não é a solução correta e sim uma gambiarra, até porque a 'div bloquear' só está localizada na index).

 

E tinha que ser também o bendito iexplorer para acabar com a nossa felicidade...

Alguém tem idéia de como resolver para funcionar 'em todos os navegadores'?

Compartilhar este post

Link para o post
Compartilhar em outros sites

eibon    2

eibon
Postado

Tenta assim:

<html>
	<head>
		<title>Exemplo</title>
		<script>
			function liberar(){
				document.getElementsByTagName("body")[0].style.display = 'block';
			}
		</script>
	</head>
		<body style="display: none;" onload="java script:liberar();">
			Seu site
		</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Felipe Torres    1

Felipe Torres
Postado

e ai galera quem poder ver se esta funfando o "PRELOADER".

a net aqui no serviço é otema e coloquei arquivos grandes e nada de ficar lento.

 

 

www.sonhoterapia.com.br/terapia2/principal.html

 

valeu, aguardo respostas.

Compartilhar este post

Link para o post
Compartilhar em outros sites

vidaloukaig    0

vidaloukaig
Postado

É... Aqui não resolveu nada... Alguém pode ajudar?

 

java script

function liberar(){
	document.getElementsByTagName("body")[0].style.display = 'block';
	   // ou seria document.getElementById('bloquear').style.display='none';
	document.body.style.overflow='scroll';
}

css

td img {display: none;}body {
	overflow:hidden;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	margin:0;
}

index.php

<?php header("Content-Type: text/html; charset=ISO-8859-1",true); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
@import url("css/style.css");
</style>
<script language="JavaScript" src="js/javascript.js"></script>
<title>. . . : : LagosMotors.com.br - Home : : . . .</title>
</head>

<body onload="liberar();">
<div id="bloquear">
<h2>Aguarde, carregando...</h2>
</div>
<div id="geral">
	<div id="header"><?php include "header.html"; ?>
	</div>
	<div id="menu"><?php include "menu.html"; ?>
	</div>
	<div id="util"><?php include "home.php"; ?>
	</div>
</div>
	<div id="footer"><?php include "footer.html"; ?>
	</div>
</body>
</html>

Alguém pode ajudar a fazer esse script funcionar vários os navegadores?

Até agora só funcionou direito no firefox usando isso:

function liberar(){

document.getElementById('bloquear').style.display='none';

document.body.style.overflow='scroll';

}

No resto, nem pensar...

 

Valeu galera! No aguardo...

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito