jQuery 切换动画 [英] jQuery toggle animation

问题描述

我有这个 jQuery:

I have this 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);
   });
});

这工作正常，但我需要稍微扩展一下功能.我还想与#panel div 同步操作另一个div 的属性.我尝试添加另外两个与二级 div 相关的函数，但我只得到了一个 4 阶段切换......哈哈！原谅我的无知！

This is working fine, but I need to extend the functionality a little. I want to also similarly manipulate another div's properties in sync with the #panel div. I tried adding two more functions relating to the secondary div, but I just got a 4-phase toggle...haha! Forgive my ignorance!

谢谢各位！

推荐答案

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

这篇关于jQuery 切换动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！