color - jQuery alternar la animación

toggle css jquery

Question

Tengo este 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);
});
});

Esto está funcionando bien, pero necesito extender la funcionalidad un poco. También quiero manipular de manera similar las propiedades de otro div en sincronización con el #panel div. Traté de agregar dos funciones más relacionadas con el div secundario, pero acabo de obtener un alternar de 4 fases ... jaja! Perdona mi ignorancia!

¡Gracias chicos!

Answer 1

No creo que agregar funciones duales dentro de la función de alternar funcione para un evento de clic registrado (a menos que me falte algo)

Por ejemplo:

$(''.btnName'').click(function() {
top.$(''#panel'').toggle(function() {
$(this).animate({
// style change
}, 500);
},
function() {
$(this).animate({
// style change back
}, 500);
});

Answer 2

$(''.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);
});

Answer 3

onmouseover="$(''.play-detail'').stop().animate({''height'': ''84px''},''300'');"
onmouseout="$(''.play-detail'').stop().animate({''height'': ''44px''},''300'');"

Solo ponga dos paradas: una onmouseover y una onmouseout.