charly Posted March 28, 2013 at 03:05 PM Report #500699 Posted March 28, 2013 at 03:05 PM 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). http://img834.imageshack.us/img834/1387/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. http://img845.imageshack.us/img845/443/77334616.png Como posso corrigir esta questão?
yoda Posted March 28, 2013 at 03:29 PM Report #500701 Posted March 28, 2013 at 03:29 PM Podes registar um evento que seja activado pelo botão também e que não deixe a div ficar invisível enquanto o cursor estiver por cima. before you post, what have you tried? - http://filipematias.info sense, purpose, direction
clera Posted March 28, 2013 at 04:22 PM Report #500710 Posted March 28, 2013 at 04:22 PM 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..
charly Posted March 28, 2013 at 04:37 PM Author Report #500711 Posted March 28, 2013 at 04:37 PM 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>
clera Posted March 28, 2013 at 05:36 PM Report #500715 Posted March 28, 2013 at 05:36 PM 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>
charly Posted April 2, 2013 at 01:20 PM Author Report #501228 Posted April 2, 2013 at 01:20 PM @clera, não há maneira de manter a estrutura actual onde o onmouseout ignore o conteúdo da div'?
brunoais Posted April 2, 2013 at 03:13 PM Report #501262 Posted April 2, 2013 at 03:13 PM 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%.
charly Posted April 2, 2013 at 04:51 PM Author Report #501280 Posted April 2, 2013 at 04:51 PM @brunoais , o jQ DOM pode resolver esta situação?
brunoais Posted April 3, 2013 at 03:20 PM Report #501428 Posted April 3, 2013 at 03:20 PM 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%.
charly Posted April 8, 2013 at 10:23 AM Author Report #502101 Posted April 8, 2013 at 10:23 AM Obrigado a todos, irei optar por ter um objecto com um onclick para efectuar o fecho.
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now