Ir para o conteúdo
  • Revista PROGRAMAR: Já está disponível a edição #60 da revista programar. Faz já o download aqui!

charly

Jquery.animate , problema com objectos

Mensagens Recomendadas

charly

Olá pessoal,

estou a usar Jquery para fazer uma pequena animação após o clique num botão/imagem.

Passando a explicar, como podem ver na imagem abaixo ao clicar no botão CONTA, uma DIV faz slide para apresentar um pequeno formulário. Estou a usar a função animate para trazer essa mesma DIV para áreas visiveis, pois encontra-se escondida em valores negativos (top: -250px).

96047865.png

O grande problema é que ao colocar o cursor sobre um dos elementos presentes na DIV, como os inputs e buttons, a DIV volta a recolher, quando essa função so deveria correr quando o cursor sai da DIV.

77334616.png

Como posso corrigir esta questão?

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
clera

boas, tens outra opçcão mais simples, que é teres uma div invisível por baixo da que faz slide.

O slide só recolhe quando fizeres hover à div invisível ;)

pelo menos a mim parece-me mais simples..

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
charly

Este é o código que se encontra na DIV negra, algo que tenho de corrigir?

<div id="slide-search" onmouseout="$(this).animate({'top':'-200px'}, {queue: false, duration: 1500, easing: 'easeOutQuad'});">
	    <div style="width: 900px; margin: 0 auto;">
		    <?php include './pages-e/search.php'; ?>
	    </div>
    </div>

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
clera

mas esse é o tal que ao ires aos campos de input e butoes desaparece certo?

para mim seria uma coisa deste género ;)

<div id="slide-search">
<div style="width: 900px; margin: 0 auto;">
 <?php include './pages-e/search.php'; ?>
</div>
<div style="width: 100%; position:absolute; height:100%; z-índex:-1; opacity:0"  id="slide-close" onmousehover="$('#slide-search').animate({'top':'-200px'}, {queue: false, duration: 1500, easing: 'easeOutQuad'}, function(){$('#slide-close').css('display', 'none')});"> </div>
</div>

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
brunoais

Aconselho vivamente a não usar os atributos on*.

Usem os métodos do DOM em vez disso.


"[Os jovens da actual geração]não lêem porque não envolve um telecomando que dê para mirar e atirar, não falam porque a trapalhice é rainha e o calão é rei" autor: thoga31

Life is a genetically transmitted disease, induced by sex, with death rate of 100%.

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites
brunoais

Sim. o jQuery usa o DOM para manipular o HTML.

Pessoalmente prefiro não usar o jQuery a n ser para animações mais complicadas, de qq modo.


"[Os jovens da actual geração]não lêem porque não envolve um telecomando que dê para mirar e atirar, não falam porque a trapalhice é rainha e o calão é rei" autor: thoga31

Life is a genetically transmitted disease, induced by sex, with death rate of 100%.

Partilhar esta mensagem


Ligação para a mensagem
Partilhar noutros sites

Crie uma conta ou ligue-se para comentar

Só membros podem comentar

Criar nova conta

Registe para ter uma conta na nossa comunidade. É fácil!

Registar nova conta

Entra

Já tem conta? Inicie sessão aqui.

Entrar Agora

×

Aviso Sobre Cookies

Ao usar este site você aceita os nossos Termos de Uso e Política de Privacidade. Este site usa cookies para disponibilizar funcionalidades personalizadas. Para mais informações visite esta página.