ShiftActif fórum


Participe da melhor comunidade sobre fóruns!

Bem vindo ao fórum de suporte e de informações técnicas ShiftActif. Aqui, solucionamos suas dúvidas sobre os tutoriais exclusivos fornecidos pela nosso subfórum de tutoriais além de suporte opcional ao Forumeiros.com, Blogger e temas grátis do Criarumblog.com! Você encontrará FAQs, astúcias em códigos e efeitos especiais em CSS, Javascript e outros para complementar seu fórum ou Blog!
Venha participar desta grande comunidade!!!
Compartilhe
Ver o tópico anteriorIr em baixoVer o tópico seguinte
avatar
Adminactif
Adminactif
Masculino
Idade : 23
PointActif's : 4810
ReputActifs : 97
Mensagens : 2707
Inscrição : 13/04/2011

Localização : Vilhena - RO
100%
Ver perfil do usuáriohttp://www.shiftactif.com/

[TUTORIAL] Carregamento de página simples com HTML

em Qui 17 Jan - 19:01


Carregamento com HTML e Script



Conhecemos o carregamento em páginas com fundo escuro postado no suporte oficial do Forumeiros, mas algumas vezes optar por algo simples e ao mesmo tempo quase que não notável é o objetivo de alguns administradores.



--> Tutoriais <--
Carregamento de página simples com HTML




- Widgets personalizados:
Vamos acessar os widgets personalizados e aplicar o código HTML e um pequeno script que fará com que o efeito esteja funcionando após a aplicação do código HTML.

Painel de controle > Módulos > Portal e Widgets > Gestão dos widgets personalizados >

Código:
<script type="text/javascript">window.onload=function(){setTimeout(function(){document.getElementById('carregando').style.display='none'},10)}</script><div id="carregando" style="position: fixed;width: 100%;top:230px;left:0;z-index: 9999;"><div style="#DCE2E8 background:url(http://svphuyen.com/2012win7/w7/mm.png);margin: 0px auto;width: 270px;height: 75px;border:1px solid #ccc"><div style="background:#fff url() no-repeat 50% bottom;text-align:center;padding-top:39px;border:1px solid #ccc;margin:7px 5px"><img src="http://i12.servimg.com/u/f12/16/63/75/54/loadin10.gif" width="190" aling="center"/><p style="font:12px Tahoma; font-weight:bold;border:solid transparent">O fórum está carregando. Aguarde...</p></div></div></div>

- jQuery para páginas .JS:
Para quem preferir o JavaScript para todas as páginas, acesse PA > Módulos > HTML e JavaScript > Gestão dos códigos Javascript > Criar um novo Javascript > e em Investimento marque a opção desejada, adicionando o seguinte jQuery:
Código:
jQuery(document).ready(function(){jQuery('body').before('<div id="carregando" style="position: fixed;width: 100%;top:230px;left:0;z-index: 9999;"><div style="#DCE2E8 background:url(http://svphuyen.com/2012win7/w7/mm.png);margin: 0px auto;width: 270px;height: 75px;border:1px solid #ccc"><div style="background:#fff url() no-repeat 50% bottom;text-align:center;padding-top:39px;border:1px solid #ccc;margin:7px 5px"><img src="http://i12.servimg.com/u/f12/16/63/75/54/loadin10.gif" width="190" aling="center"/><p style="font:12px Tahoma; font-weight:bold;border:solid transparent">O fórum está carregando. Aguarde...</p></div></div></div>')});
Logo após, adicione à um widget personalizado o seguinte código:
Código:
<script type="text/javascript">window.onload=function(){setTimeout(function(){document.getElementById('carregando').style.display='none'},10)}</script>

  • Posso personalizar o código?
    Claro! Há trechos no código que merecem sua atenção, principalmente no HTML. No Javascript você pode realizar a mesma modificação!

  • Resultado:






© ShiftActif


Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
[Dúvida] Carregamento de página simples com HTML
Ver o tópico anteriorVoltar ao TopoVer o tópico seguinte
Permissão deste fórum:
Você não pode responder aos tópicos neste fórum