jQuery alternância de animação
Pergunta
Eu tenho esse jQuery:
$(document).ready(function()
{
$("#panel").hide();
$('.login').toggle(
function()
{
$('#panel').animate({
height: "150",
padding:"20px 0",
backgroundColor:'#000000',
opacity:.8
}, 500);
},
function()
{
$('#panel').animate({
height: "0",
padding:"0px 0",
opacity:.2
}, 500);
});
});
Isso está funcionando bem, mas eu preciso para estender a funcionalidade um pouco. Quero também semelhante manipular as propriedades de uma outra div em sincronia com o div #panel. Eu tentei adicionar mais duas funções relativas à div secundário, mas eu só tenho uma alternância de 4 fases ... haha! Perdoem a minha ignorância!
Obrigado rapazes!
Solução
$('.login').toggle(
function(){
$('#panel').animate({
height: "150",
padding:"20px 0",
backgroundColor:'#000000',
opacity:.8
}, 500);
$('#otherdiv').animate({
//otherdiv properties here
}, 500);
},
function(){
$('#panel').animate({
height: "0",
padding:"0px 0",
opacity:.2
}, 500);
$('#otherdiv').animate({
//otherdiv properties here
}, 500);
});
Outras dicas
Eu não acho que a adição de funções duplas dentro das obras do cargo alternar para um evento de clique registrada (A menos que eu estou faltando alguma coisa)
Por exemplo:
$('.btnName').click(function() {
top.$('#panel').toggle(function() {
$(this).animate({
// style change
}, 500);
},
function() {
$(this).animate({
// style change back
}, 500);
});
onmouseover="$('.play-detail').stop().animate({'height': '84px'},'300');"
onmouseout="$('.play-detail').stop().animate({'height': '44px'},'300');"
Basta colocar duas paradas -. Um onmouseover e um onmouseout
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow