ShiftActif fórum

[TUTORIAL] Caixa de login no menu de navegação ao passar o mouse Homepg10

Participe da melhor comunidade sobre fóruns!

Bem vindo [TUTORIAL] Caixa de login no menu de navegação ao passar o mouse 405374159 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!!! [TUTORIAL] Caixa de login no menu de navegação ao passar o mouse 1660898911
ShiftActif fórum

[TUTORIAL] Caixa de login no menu de navegação ao passar o mouse Homepg10

Participe da melhor comunidade sobre fóruns!

Bem vindo [TUTORIAL] Caixa de login no menu de navegação ao passar o mouse 405374159 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!!! [TUTORIAL] Caixa de login no menu de navegação ao passar o mouse 1660898911

[TUTORIAL] Caixa de login no menu de navegação ao passar o mouse

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

[TUTORIAL] Caixa de login no menu de navegação ao passar o mouse Empty [TUTORIAL] Caixa de login no menu de navegação ao passar o mouse

Mensagem por Shek Seg 16 Abr - 0:23


[TUTORIAL] Caixa de login no menu de navegação ao passar o mouse Permissions

Caixa de login no menu de navegação ao passar o mouse


Com o uso básico do código Java script, vamos neste tutorial aprender a realizar um grande efeito visual e funcional no seu fórum, que pode ter certeza que vai lhe agradar e agradar aos seus membros.


--> Tutoriais <--
Caixa de login no menu de navegação ao passar o mouse



- Páginas .JS:
Com essa opção será possível adicionar-mos o Javascript ao fórum sem muitos problemas, mas lembre-se que antes de publicar essa página .JS,
pré-visualize a mesma.
Painel de controle >> Módulos >> HTML & JavaScript >> Gestão dos códigos JavaScripts >>

[TUTORIAL] Caixa de login no menu de navegação ao passar o mouse Painel13
[TUTORIAL] Caixa de login no menu de navegação ao passar o mouse 110111[TUTORIAL] Caixa de login no menu de navegação ao passar o mouse 398853 Título - Correspondente ao nome da página JavaScript/jQuery que será criada.
[TUTORIAL] Caixa de login no menu de navegação ao passar o mouse 110210[TUTORIAL] Caixa de login no menu de navegação ao passar o mouse 398853 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.
[TUTORIAL] Caixa de login no menu de navegação ao passar o mouse 110310[TUTORIAL] Caixa de login no menu de navegação ao passar o mouse 398853 Código JavaScript - Campo destinado para receber os códigos JavaScript e jQuery.
[TUTORIAL] Caixa de login no menu de navegação ao passar o mouse 110410[TUTORIAL] Caixa de login no menu de navegação ao passar o mouse 398853 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.

Agora que aprendeu sobre as páginas JS, vamos usar o código a seguir:
Código:
$(function(){$('#search-box').before(' ');$('.user_login_form').closest('.panel').addClass('loginPanel');$('input.button1[name="post"]').closest('.panel').removeClass('row2').addClass('loginPanel');$('.left-box').closest('.panel').addClass('introduction');$('a.mainmenu[href="/login"]').hover(function(){$('.quick_connex').remove();$('<div class="quick_connex panel introduction"><img class="connec_close" src="http://2img.net/i/fa/fdf3/suppri12.png" alt="(X)" title="Fechar caixa" onclick="$(\'.quick_connex\').remove();" /><form name="form_login" method="post" action="/login"><dl><dt><label for="username">Login:</label></dt><dd><input type="text" class="inputbox autowidth" value="" maxlength="40" size="25" id="username" name="username" tabindex="1"></dd></dl><dl><dt><label for="password">Senha:</label></dt><dd><input type="password" class="inputbox autowidth" maxlength="25" size="25" name="password" id="password" tabindex="2"></dd></dl><dl><dt> </dt><dd><input type="hidden" value="" name="redirect"><input type="hidden" value="" name="query"><input type="submit" class="button1" value="Conectar agora" tabindex="6" name="login"></dd></dl></form></div>').appendTo('.navbar')})})<!--Shiftactif and Forumactif desenvolvedores - http://shift.forumactif.com  Por favor, não copie o código sem autorização. Entre em contato com a equipe Shiftactif e deixe o endereço do seu fórum em nossas listagens //-->
Adicione em Todas as páginas.


- Código para folha de estilo CSS:
Agora, para finalizar vamos aplicar um CSS para personalizar a caixa, apesar que o código JS ela já funcionar.

.quick_connex{
box-shadow:0 0 10px!important;
padding:5px;
position:absolute;
right:200px;
top:185px;
width:160px
}

.quick_connex .connec_close{
bottom:3px;
float:right;
left:5px;
position:relative
}

  • Resultado:
    [TUTORIAL] Caixa de login no menu de navegação ao passar o mouse Reslt10

  • Vídeo tutorial

    www.youtube.com/watch?v=j5SRD4DLrT4


OBS: Este tutorial só funciona para Phpbb3!




© Shiftactif


[TUTORIAL] Caixa de login no menu de navegação ao passar o mouse Act_bottom Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
[Dúvida] Caixa de login no menu de navegação ao passar o mouse
Shek

Shek
Administrador

Masculino
Idade : 30
PointActif's : 7411
ReputActifs : 97
Mensagens : 2777
Inscrição : 13/04/2011

Localização : Vilhena - RO
100%

https://shiftactive.blogspot.com/

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

- Tópicos semelhantes

Permissões neste sub-fórum
Não podes responder a tópicos