jQuery - 使用animate（）函数重新创建slideDown（）效果？

Question

如何使用$ .animate函数重新创建jQuery的$ .slideDown效果？

Answer 1

将动画“height”，“marginTop”，“marginBottom”，“paddingTop”和“paddingBottom”设置为"show"。

例如：

$(...).animate({ 
    "height": "show", 
    "marginTop": "show", 
    "marginBottom": "show", 
    "paddingTop": "show", 
    "paddingBottom": "show" 
}); 

来源：jQuery的源代码。

fxAttrs = [ 
    // height animations 
    [ "height", "marginTop", "marginBottom", "paddingTop", "paddingBottom" ], 
    // width animations 
    [ "width", "marginLeft", "marginRight", "paddingLeft", "paddingRight" ], 
    // opacity animations 
    [ "opacity" ] 
]; 
... 

jQuery.each({ 
    slideDown: genFx("show", 1), 
    slideUp: genFx("hide", 1), 
    slideToggle: genFx("toggle", 1), 
    fadeIn: { opacity: "show" }, 
    fadeOut: { opacity: "hide" } 
}, function(name, props) { 
    jQuery.fn[ name ] = function(speed, callback) { 
     return this.animate(props, speed, callback); 
    }; 
}); 
... 

function genFx(type, num) { 
    var obj = {}; 

    jQuery.each(fxAttrs.concat.apply([], fxAttrs.slice(0,num)), function() { 
     obj[ this ] = type; 
    }); 

    return obj; 
}