变量不能用jQuery进行CSS转换

Question

我正在计算<ul>的高度，以便将其设为height:auto。后来我想使用该变量来翻译mainwrapper。但它不起作用，我无法弄清楚为什么......

这是代码：

jQuery.fn.animateAuto = function(prop, speed, callback) {
    var elem, height, width;
    return this.each(function(i, el) {
        el = jQuery(el), elem = el.clone().css({
            "height": "auto",
            "width": "auto"
        }).appendTo(el.parent());
        height = elem.css("height"),
            width = elem.css("width"),
            elem.remove();

        if (prop === "height")
            el.animate({
                "height": height
            }, speed, callback);
        else if (prop === "width")
            el.animate({
                "width": width
            }, speed, callback);
        else if (prop === "both")
            el.animate({
                "width": width,
                "height": height
            }, speed, callback);
    });
}

使用变量“height”来转换包装器：

$(".menu-icon").bind("click", function(e) {
    if ($('.navlinks').hasClass('autoheight')) {
           $(".navlinks").removeClass("autoheight");
           $(".mainwrapper").css('transform', 'translateY(-' + height + 'px)');

    } else {
           $(".navlinks").addClass("autoheight");
           $(".mainwrapper").css('transform', 'translateY(' + height + 'px)');
    }
});

一切正常，只有变量在变换中什么都不做？