Изменение CSS параметра transform

[FreeZa]

Всем доброго времени суток, возникла нестандартная задачка, облазил весь инет, не нашел того что ищу...

<div class="obj_1 zx-1" style="transform: translateY(400px) translateX(350px) translateZ(-120px) rotateX(0deg) rotateY(-5deg);"></div>

Собственно нужно изменить только один параметр ( rotateX ) остальные нужно оставить без изменений

-----------------------

Поясню сложность:

если напрямую указать 1 параметр, то остальные обнуляются, а это не есть хорошо...

если делать так:

var obj_1 = $( ".obj_1" ).css("WebkitTransform");

то выдает вот такую штуку:

matrix3d(0.9961946980917455, 0, 0.08715574274765817, 0, 0, 1, 0, 0, -0.08715574274765817, 0, 0.9961946980917455, 0, 350, 400, -120, 1)

Собственно придется перегружать код вычислением градусов, я уж не говорю о том, что придется где-то искать учебник по геометрии =)

-----------------------

Собственно, подскажите как быть...
Заранее спасибо =)

[ksa]

var obj_1 = $( ".obj_1" ).css("WebkitTransform");

А так

var obj_1 = $( ".obj_1" ).css("WebkitTransform-rotateX");

Даст что-то?

[FreeZa]

Нет((( свойства "WebkitTransform-rotateX", есть только "WebkitTransform"

[рони]

FreeZa,
записываем матрицу с нужными параметрами заранее потом подставляем нужное значение

[FreeZa]

записываем матрицу с нужными параметрами заранее
Нет возможности так сделать, параметры меняются в процессе

[FreeZa]

Есть конечно мысль, узнать все параметры трансформа не в матрице, а в а сразу градусах, и просто подставить переменную...вот только как это сделать не понятно...

[danik.js]

Собственно нужно изменить только один параметр ( rotateX ) остальные нужно оставить без изменений

Боюсь придется изначально задавать значения через javascript. Пример:

var transforms = {
    translateY: {value: 400, unit: 'px'},
    translateX: {value: 350, unit: 'px'},
    translateZ: {value: -120, unit: 'px'},
    rotateX: {value: 0, unit: 'deg'},
    rotateY: {value: -5, unit: 'deg'}
};

Object.defineProperty(transforms, 'stringify', {
    enumerable: false,
    value: function() {
        var functions = [];
        for (var key in this) {
            var value = this[key];
            functions.push(key + '(' + value.value + value.unit + ')');
        }
        return functions.join(' ');
    }
});

transforms.rotateX.value += 10;
alert(transforms.stringify());

[FreeZa]

danik.js,
Спасибо! придется всеже делать через одно место, хотя нашел я вариант один...
Добавил дочерний элемент, и его уже кручу верчу, но проблема в том, что объект все равно получится крутить только по одной оси =(

[FreeZa]

Мндя...я то думал CSS изометрический движок будет сложно написать, оказалось все просто, вот только косяк с реал-таймом получается =(

[danik.js]

Вобще, css-функции - это какой-то тупняк, так как к ним нет доступа из JS. Это же гон переводить объекты в строку, чтобы потом браузер снова распарсил строку в объекты.
Иначе работал filters в IE - там был доступ как из css, так и из js к нормальной модели.