高度动画只在firefox中慢

Question

我写了一些js，以确保始终保持一定高度的容器div 它的儿童div高度总是达到相同的数量。但它的ff很慢！ 在chrome中运行this fiddle，即ff。 你应该看到它在firefox中运行速度慢了6倍。 任何想法为什么或如何解决它？

我也很乐意和我的问题的替代解决方案。

以下是我使用的代码：

var timeout;
var stripHeight = 80;
var stripHeightClick = 300;
var duration = 500;

Element.prototype.setHeight = function (set) {
    this.style.height = set + "px";
};

Element.prototype.addHeight = function (add) {
    this.style.height = (parseInt(this.style.height) + add) + "px";
};

Element.prototype.getHeight = function () {
    var style = getComputedStyle(this);
    return parseInt(style.height);
};

window.resize = function (self){
    var container = document.getElementById("container");
    var fc = document.getElementById("fc");
    fc.innerHTML = 0;
    var hoverElement = self;
    clearTimeout(container.resizeTimeout);
    hoverElement.isDone = false;
    var heightDiff = stripHeightClick - hoverElement.getHeight();
    var startTime = new Date().getTime();
    var timeElapsed = 0;
    var increment = 0;
    var oldHeight = hoverElement.getHeight();
    var newHeight;
    var shrinkLastIndex = 0;
    var elementsToShrink = [];
    for (var i = 0; i < container.children.length; i++) {
        if (container.children[i] !== hoverElement && container.children[i].getHeight() > stripHeight) {
            elementsToShrink.push(container.children[i]);
            container.children[i].isDone = false;
        }
    }

    container.resizeTimeout = setTimeout(function loop() {
        if (timeElapsed < duration) {
            var timeElapsedPercentage = (timeElapsed / duration);
            var newHeight = (Math.round(timeElapsedPercentage * heightDiff) + oldHeight);
            var increment = newHeight - hoverElement.getHeight();
            hoverElement.style.height = newHeight + "px";
        } else {
            increment = stripHeightClick - hoverElement.getHeight();
            hoverElement.style.height = stripHeightClick + "px";
        }

        var rem = increment % elementsToShrink.length;
        var dec = increment - rem;
        if (dec - rem > 0) {
            dec /= elementsToShrink.length;
            for (var i = 0; i < elementsToShrink.length; i++) {
                elementsToShrink[i].addHeight(-dec);
            }
        }
        if (rem > 0) {
            for (var i = shrinkLastIndex; dec > 0;
            (i + 1 < elementsToShrink.length) ? i++ : i = 0) {
                elementsToShrink[i].addHeight(-1);
                shrinkLastIndex = (i + 1 < elementsToShrink.length) ? i + 1 : 0;
                dec--;
            }
        }

        //frame count update
        fc.innerHTML = parseInt(fc.innerHTML)+1;

        if (!(timeElapsed < duration)) {
            hoverElement.isDone = true;
            return;
        }
        timeElapsed = new Date().getTime() - startTime;
        container.resizeTimeout = setTimeout(loop.bind(hoverElement), 0);
    }.bind(hoverElement), 0);
}