Получить значение шкалы элемента?

Ответ 1

Если это было задано с помощью матрицы, я думаю, вы не можете с простым способом, но вы можете легко проанализировать значение:

var matrixRegex = /matrix\((-?\d*\.?\d+),\s*0,\s*0,\s*(-?\d*\.?\d+),\s*0,\s*0\)/,
    matches = $(element).css('-webkit-transform').match(matrixRegex);

matches[1] будет содержать scaleX, а matches[2] будет содержать scaleY. Если возможно, что другие преобразования также были применены, вам нужно слегка подстроить регулярное выражение, потому что теперь он предполагает, что все остальные параметры равны 0.

Одним из способов получения значений масштаба может быть удаление любых преобразований, измерение вычисленной ширины/высоты элемента, а затем добавление их обратно и измерение снова. Затем разделите новые/старые значения. Не пробовал, но это может сработать. Сам jQuery использует подобный подход для многих измерений, он даже имеет недокументированную функцию $.swap() только для этого.

PS: Вы используете -o-transform -moz-transform и -ms-transform тоже, правильно?

Ответ 2

Простейшим решением для определения масштабного коэффициента между документом и элементом является следующее:

var element = document.querySelector('...');
var scaleX = element.getBoundingClientRect().width / element.offsetWidth;

Это работает, потому что getBoundingClientRect возвращает фактическое измерение, а offsetWidth/Height - размер без масштабирования.

Ответ 3

Если вам нужно настроить таргетинг только на веб-кит (потому что он для iPhone или iPad), самый надежный и быстрый способ - использовать собственный веб-ресурс javascript:

node = $("#yourid")[0];
var curTransform = new WebKitCSSMatrix(window.getComputedStyle(node).webkitTransform);
alert(curTransform.a); // curTransform is an object,
alert(curTransform.d); // a through f represent all values of the transformation matrix

Здесь вы можете посмотреть демо: http://jsfiddle.net/umZHA/

Ответ 4

Слишком поздно для ОП, но может быть полезно в будущем. Существует простой способ сделать это с помощью расщепления:

function getTransformValue(element,property){       
        var values = element[0].style.webkitTransform.split(")");
        for (var key in values){
            var val = values[key];              
            var prop = val.split("(");          
            if (prop[0].trim() == property)
                return prop[1];
        }                   
        return false;           
    }

Это специфический веб-код, но его можно легко расширить для большего количества браузеров, изменяющих первую строку.