Efeito On-Load na pagina como Neste forum.

Item: Efeito On-Load na pagina como Neste forum.
Rating: 1

por patamar16 24.03.12 0:57

Qual é minha questão:
Ola, eu sempre estive procurando este efeito, mais nunca encontrei, queria saber fazer o efeito de loading que tem neste forum:
http://forunmuonline.forumeiros.net/
aparece em todas as paginas um ''Load'' enquanto carrega... Alguem pode me Passar este codigo ou um topico que contenha o Mesmo? Brigadaum Ae!

Medidas que eu tomei para corrigir o problema:
.

Links e imagens do meu problema:
.

Endereço do meu fórum:
http://imperadores.forumeiro.com

Versão do meu fórum:
INVISION

por Roevs 24.03.12 14:34

Painel de Controle Seta

Módulos

HTML & JavaScript Seta

Gestão das páginas HTML

Clica em

Criar uma nova página HTML

Título * : Entrada

Você deseja utilizar o início e o final da página do seu fórum ? : Marca Não

Usar esta página como página inicial? : Marca Sim

Código HTML * : Adiciona o Código Abaixo

Código:: <html><head><title>Mundo CAF</title><meta http-equiv=refresh content="5;url=/index.htm"></head><script>var i=5;function contagemRegressiva(){if(i==0){document.getElementById('cronometro').innerHTML='0';}else{i--;document.getElementById('cronometro').innerHTML=i;}}setInterval("contagemRegressiva()",1000);</script><body bgcolor=#000000><br><br><br><br><br><br><br><br><div align=center><tr><Font face="Century Gothic,Arial,Verdana" Size=2 Color=white><img src="http://i43.servimg.com/u/f43/15/43/88/47/untitl17.png" border="0" > <br> Bem vindo ao Mundo CAF! Aguarde o forum carregar...</font></div><br><br><div align=center><table width=220 border=0 align=center cellpadding=0 cellspacing=0><tr><td><div align=center><span class=style1><img src=http://i46.servimg.com/u/f46/16/46/71/99/loadin15.gif width=368 height=25 border=0 usemap=#Map /> <FONT FACE="Century Gothic,Arial,Verdana" SIZE=1 COLOR=white>Carregando...<div id=cronometro>5</div></FONT></span></div></td></tr></table><br><br><br><br><br><br><br><br><br><br><a href="http://www.forumeiros.com"><font color=#000000>forumeiros.com</font></a></span></body></html>

Depois clica em salvar e pronto agora e só editar o código

por patamar16 24.03.12 16:01

Esse Ate que funfou legal como pagina inicial, mais eu to dizendo o efeito de Loading que ele usa em todas as paginas e topicos. antes de entrar nos topicos ou paginas, aparece um Loading Branco la... queria saber esse efeito, que pega-se em todas as paginas.
Poder me ajudar agradeço ;D

por MateusV. 24.03.12 16:03

Olá, leia o conteúdo do spoiler

Spoiler:

Efeito On-Load na pagina como Neste forum. Portail

Função de carregamento em páginas

Em sites com toques profissionais encontramos scripts interessantes de quando clicamos em um link que redireciona para outra página emite um efeito "carregando". Neste tutorial vamos usar um efeito Jquery especial que vai reproduzir este efeito.

--> Tutoriais, dicas e astúcias <--
Função de carregamento em páginas

1º - Noção da função páginas javascript:
Para que seja possível proceguir é importante que saiba que precisamos ter conhecimento básico sobre a função Página javascript que temos em nosso painel de controle.

Painel de controle >> Módulos >> HTML & JavaScript >> Gestão dos códigos JavaScripts >>

Efeito On-Load na pagina como Neste forum. Painel13

Efeito On-Load na pagina como Neste forum. 110111

Título - Correspondente ao nome da página JavaScript/jQuery que será criada.

Efeito On-Load na pagina como Neste forum. 110210

Localização - São destinados os devidos locais para onde você aplicará os efeitos do JavaScript nos fóruns. Pode ser na galeria, nos fóruns ou sub-fóruns. Vamos ver algumas opções:
No índice : O código será aplicado ao índice do fórum.
No portal : O código será aplicado ao Portal do fórum.
Nos sub-fóruns (Fóruns) : O código será aplicado nos Fóruns e Sub-fóruns.
Sobre os temas : O código será aplicado aos tópicos do fórum.
Na galeria : O código será aplicado na sua Galeria de imagens.
Em todas as páginas : O código será aplicado em todas as páginas do fórum.

Efeito On-Load na pagina como Neste forum. 110310

Código JavaScript - Campo destinado para receber os códigos JavaScript e jQuery.

Efeito On-Load na pagina como Neste forum. 110410

Habilitar o gerenciamento dos códigos JavaScript - Ao selecionar a opção sim, estará ativando a função páginas Javascript no seu fórum. Se selecionar não, as páginas serão desabilitadas no fórum.

Clique no botão "Criar um novo javascript" para passar-mos para o próximo passo.

2º - Modificações no código Jquery exebido:
Com a página de javascript aberta em seu painel de controle, teremos que adicionar um Jquery ao qual fará com que uma imagem seja exibida a cada carregamento de página, caso não tenha compreendido explicaremos logo mais nas questões no fim deste tutorial.
Em 'Investimento', marque para o efeito ser reproduzido "Em todas as páginas".

;jQuery(document).ready(function(){jQuery('body').before('<div class=pagcarreg style="text-align:center"><style>html{background-image:url(IMAGEM_DE_FUNDO)}</style><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><img src="IMAGEM_DE_CARREGAMENTO" border=0></div>');jQuery('body').hide()});window.onload=function(){jQuery('body').show();jQuery('.pagcarreg').remove()};

Depois de personalizar como desejar, basta confirmar a nova página .JS e verificar o resultado no fórum na transferencia de uma página para outra.

Se precisar de imagens para o carregamento, você poderá buscar imagens no Google Imagens com o título "Carregamento.gif". Se preferir, Forumeiros tem imgens de carregamento, mas para obter basta copiar o endereço no seguinte tutorial: Script de carregamento.

É possível ter um Jquery que não mostre imagem de fundo?
Sim, claro! Substitua/adicione o código abaixo em sua página .JS:
;jQuery(document).ready(function(){jQuery('body').before('<div class=pagcarreg style="text-align:center"><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><img src="IMAGEM_DE_CARREGAMENTO" border=0></div>');jQuery('body').hide()});window.onload=function(){jQuery('body').show();jQuery('.pagcarreg').hide()};
Onde encontro mais imagens de carregamento como Forumeiros?
Se preferir, Forumeiros tem imgens de carregamento, mas para obter basta copiar o endereço no seguinte tutorial: Script de carregamento.

Não resultou. Existe outro local para adicionar o código?
Sim. Neste momento poderá recorrer as páginas HTML:
Spoiler: