[Tutorial] Ajax Loading IPBoard

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

[Tutorial] Ajax Loading IPBoard

Mensagem por JQuery em Sab Mar 01, 2014 7:56 pm



Ajax Loading IPBoard

Quando você entra em um fórum IPBoard, você vê um carregamento na parte superior da tela ? Hoje você irá aprender á pôr este efeito em teu fórum!

Este código foi testando apenas na versão PunBB, mas deve funcionar e todas as versões.


--> Tutoriais, dicas e astúcias <--
Ajax Loading IPBoard



- Colocação do Java-Script
Primeiro iremos aceder ao Painel de controle  Módulos  HTML & JAVASCRIPT  Gestão dos códigos JavaScript Crie um novo.

Título * : Ajax Loading by [F]lames
Investimento: Em todas as páginas
Código JS * :
Código:
jQuery(function() {
   jQuery('body').prepend('<div id="ajax_loading" style=""><img src="http://i.imgur.com/gygr8wi.gif" alt="Loading..."></div>');
   jQuery('a').click(function() {
      jQuery('#ajax_loading').slideDown();
      setTimeout('load()', 5000);
   });
});
function load() {
   jQuery('#ajax_loading').slideUp('2000');
}
setTimeout('load()', 5000);


- Colocação do Codigo CCS
Primeiro iremos aceder ao Painel de controle  Visualização  Imagens e Cores  Cores Folha de estilo CSS:

Código:
#ajax_loading {background: #000;color: #fff;text-align: center;padding: 5px 0 8px;width: 8%;top: 0px;left: 46%;-moz-border-radius: 0 0 5px 5px;-webkit-border-bottom-right-radius: 5px;-webkit-border-bottom-left-radius: 5px;border-radius: 0 0 5px 5px;z-index: 10000;position: fixed;-moz-box-shadow: 0px 3px 5px rgba(0,0,0,0.2);-webkit-box-shadow: 0px 3px 5px rgba(0,0,0,0.2);box-shadow: 0px 3px 5px rgba(0,0,0,0.2);opacity: 0.6;}


- Resoltado





© Web Design


Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
Ajax Loading IPBoard
avatar
JQuery
Administrador
Administrador

Mensagens : 142
Localização : Penafiel
Reputação : 26
Barra de respeito às regras :

Ver perfil do usuário http://webdesign.forum-pro.net

Voltar ao Topo Ir em baixo

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

 
Permissão deste fórum:
Você não pode responder aos tópicos neste fórum