Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

''''''''''''''

[Resolvido] JQuery, Função Toggle

Recommended Posts

Gostaria de uma ajuda para completar meu codigo.

Fiz um sistema JQuery, com a função TOGGLE... Ela funciona legal, mais queria que ela fizesse algumas coisas a mais.

 

PRINT:

sssssfg.png

 

Eu coloquei, ao abrir a toogle, uma MASK no resto do site, para que só a div de login esteja acessível enquanto aberta.

Até ai tudo bem.

Eu gostaria de uma ajuda para colocar as seguitnes funções:

Quando clica fora da caixa (DIV LOGIN) fechar a DIV.

Quando clica em um segundo botao dentro da div tambem fechar a DIV... e Claro, no botao

INICIAR SESSÃO tambem / Esse ja funciona... Só salientando que quero os 3 com a função '-'

 

Axo que da pra entender D: não sou bom com explicações...

 

CÓDIGO:

 

    <script type="text/javascript">
      $(document).ready(function() {
          $("#top-site div a[id='session']").toggle(
                  function() {
                          $(".cima").fadeIn(800); // ou slideDown()
					   $("#mask").fadeIn(800);
					   $(this).addClass("ativo");
                  },
                  function() {
                          $(".cima").fadeOut(800); // ou slideUp()
					   $("#mask").fadeOut(800);
					   $(this).removeClass("ativo");
                  }
          );
  		});
   </script>

 

VLW

Compartilhar este post


Link para o post
Compartilhar em outros sites

Quando clica fora da caixa (DIV LOGIN) fechar a DIV.

dispare um click na #mask q feche oq você precisa.

 

Quando clica em um segundo botao dentro da div tambem fechar a DIV... e Claro, no botao

qual a duvida ?

mostre como você tentou fazer.

Compartilhar este post


Link para o post
Compartilhar em outros sites

o que eu fiz na #MASK foi o seguinte:

 

    <script type="text/javascript">
      $(document).ready(function() {
          $("#top-site div a[id='session'], #MASK").toggle(
                  function() {
.......
   </script>

Funciono parcialmente, o problema é que ele não faz "removeClass("ativo");" do código, fazendo com que o botao fique como ativo (OBVIO) ... e faz com que eu tenha que aperta 2x no INICIAR SESSÃO para abrir denovo a div.

 

Quando clica em um segundo botao dentro da div tambem fechar a DIV... e Claro, no botao

Quero colocar ainda outro botao dentro da div para fechar...

eu coloquei aki, da mesma maneira de cima, adicionando:

 

$("#top-site div a[id='session'], #MASK, #CANCEL-LOGIN").toggle(  // Não sta em maiusculo no codigo original '-'

 

eu gostaria mesmo de uma ideia que diga, como eu posso fazer isso, sem esse pequeno erro.

 

 

 

 

@EDIT

 

 

Resolvido, troquei a função toggle, pela função click! resultado do código:

 

 

    <script type="text/javascript">
      $(document).ready(function() {
		$("#top-site div a[id='session']").click(function() {
			$(".cima").fadeIn(800); // ou slideDown()
			$("#mask").fadeIn(800);
			$(this).addClass("ativo");
          });

		$("#mask").click(function(){
		   	$(".cima").fadeOut(800); // ou slideUp()
			$(this).fadeOut(800);
			$("#top-site div a[id='session']").removeClass("ativo");
		 });

		$("#cancel-login").click(function(){
		   	$(".cima").fadeOut(800); // ou slideUp()
			$("#mask").fadeOut(800);
			$("#top-site div a[id='session']").removeClass("ativo");
		 });

  		});
   </script>

Não é exatamente o que eu queria, mais não tendo de clicar 2x ta ótimo :P...

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.