Ajax Loading IPBoard Dom 28 Abr 2013 - 11:01
Autor: [F]lames
Funcionalidade: Todas as versões
Categoria: Recursos BestSkins
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.
1º - Adicionando o código Javascript
Aceda á:
Painel de Controle Módulos HTML & JAVASCRIPT Gestão dos Códigos JavaScript
Clique em "Criar um novo JavaScript":
Título * : Ajax Loading by [F]lames
Investimento: Em todas as páginas
Código JS * :
Confirme!
- Código:
jQuery(function() {
jQuery('body').prepend('<div id="ajax_loading" style=""><img src="https://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);
2º - Adicionando o código CSS
Aceda á:
Painel de Controle Visualização Imagens e Cores Cores Folha de estilo CSS
Adicione isto no início da enorme caixa que estás na página:
- 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;
}
Valide!
Se tiver alguma dúvida relacionada com este tópico crie um tópico de mesmo nome.