jQuery切换动画

我有这个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); }); }); 

这工作正常，但我需要扩展function。 我也希望同样操作另一个div的属性与#panel div同步。 我尝试添加两个与辅助div相关的function，但我刚刚进行了4阶段切换……哈哈！ 原谅我的无知！

多谢你们！

Answer 1

 $('.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 2

我不认为在切换function中添加双重function适用于已注册的点击事件（除非我遗漏了某些内容）

例如：

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

Answer 3

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

只需要两个站点 – 一个onmouseover和一个onmouseout。