slideUp()如何在jQuery中工作?我正在尝试制作自己的幻灯片()

前端之家收集整理的这篇文章主要介绍了slideUp()如何在jQuery中工作?我正在尝试制作自己的幻灯片()前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我看过 source code in jquery for slideup ……
// Generate shortcuts for custom animations
jQuery.each({
    slideDown: genFx("show",1),slideUp: genFx("hide",slideToggle: genFx("toggle",fadeIn: { opacity: "show" },fadeOut: { opacity: "hide" },fadeToggle: { opacity: "toggle" }
},function( name,props ) {
    jQuery.fn[ name ] = function( speed,easing,callback ) {
        return this.animate( props,speed,callback );
    };
});

我知道这是函数的简写,所以我逐渐介绍GenFX

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

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

    return obj;
}

然后是fxAttrs

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

但我无法弄清楚这段代码是如何工作的,或者我将如何创建影响HTML宽度属性的slideLeft或slideRight.

解决方法

您可以使用:
$('div').animate({ width: 'show' }); // slideLeft

$('div').animate({ width: 'hide' }); // slideRight

演示于jsFiddle.

原文链接:/jquery/178063.html

猜你在找的jQuery相关文章