Как сделать целочисленными переменные в скрипте?

Question

[megamutex]

Есть небольшой скрипт (плагин). Суть его в том, что он помогает анимировать css свойство clip. Сам скрипт оперирует переменными типа float, следовательно в свойстве css значения считаются с точкой. Как отредактировать скрипт, чтобы он работал с целочисленными переменными и при этом работал?)

(function($){
    $.fx.step.clip = function(fx){
        var elem = fx.elem,
            $elem = $(elem);
        if(fx.start === 'rect(0px, 0px, 0px, 0px)' || fx.start === 0) {
            fx.start = "rect(" + parseFloat(elem.scrollTop) + ", " + parseFloat(elem.scrollWidth) + ", "+ parseFloat(elem.scrollHeight) + ", " + parseFloat(elem.scrollLeft) + ')';
        } else {
            fx.start = $elem.css('clip'); // .replace(/,/g, " ");
        }
        var calcRect = function(pos){
            var arr = [],
                rect = fx[pos].slice(5).split(' ');

            for (var i = 0; i < rect.length; i++) {
                arr.push(parseFloat(rect[i]));
            }
            return arr;
        };
        var sa = calcRect('start'),
            ea = calcRect('end');
        var perc = parseFloat(fx.pos).toFixed(4);
        elem.style.clip = 'rect(' +
        parseFloat( ( perc * (ea[0] - sa[0]) ) + sa[0] ) + fx.unit + ', ' +
        parseFloat( ( perc * (ea[1] - sa[1]) ) + sa[1] ) + fx.unit + ', ' +
        parseFloat( ( perc * (ea[2] - sa[2]) ) + sa[2] ) + fx.unit + ', ' +
        parseFloat( ( perc * (ea[3] - sa[3]) ) + sa[3] ) + fx.unit + ')';
    };
}(jQuery));

Comments

[Сергей Мельников]

а зачем? чем вас не устраивает значение с точкой? браузер сам все округлит

Answer 1

[Александр]

"parseFloat" заменить на "parseInt", не?

Comments

[megamutex]

пробовал, скрипт не работает

[Алексей Уколов]

megamutex: что именно в нем перестает работать?

[megamutex]

Алексей Уколов: его суть. перестает анимировать свойство

[Александр]

megamutex: можно попробовать так:

(function($){ $.fx.step.clip = function(fx){ var elem = fx.elem, $elem = $(elem); if(fx.start === 'rect(0px, 0px, 0px, 0px)' || fx.start === 0) { fx.start = "rect(" + parseFloat(elem.scrollTop) + ", " + elem.scrollWidth + ", "+ elem.scrollHeight + ", " + elem.scrollLeft + ')'; } else { fx.start = $elem.css('clip'); } var calcRect = function(pos){ var arr = [], rect = fx[pos].slice(5).split(' '); for (var i = 0; i < rect.length; i++) { arr.push(rect[i]); } return arr; }; var sa = calcRect('start'), ea = calcRect('end'); var perc = fx.pos; elem.style.clip = 'rect(' + ( perc * (ea[0] - sa[0]) ) + sa[0] + fx.unit + ', ' + ( perc * (ea[1] - sa[1]) ) + sa[1] + fx.unit + ', ' + ( perc * (ea[2] - sa[2]) ) + sa[2] + fx.unit + ', ' + ( perc * (ea[3] - sa[3]) ) + sa[3] + fx.unit + ')'; }; }(jQuery));