rstacruz / jquery.transit

Super-smooth CSS3 transformations and transitions for jQuery
http://ricostacruz.com/jquery.transit
7.3k stars 864 forks source link

support css order change #229

Open RelicOfTesla opened 9 years ago

RelicOfTesla commented 9 years ago

im css(rotate) at any remote place. when i will change x,y on after... it's bad position todo.

.xx{ transform : translate(50px,0px) rotate(60deg); }
.xx{ transform : rotate(60deg)  translate(50px,0px);  }

it's different result with position .

RelicOfTesla commented 9 years ago
function any_function(obj){
// .......
obj.css({rotate : 60});
// .......
}

//... any place ....
var target = $('.xxx');
///.............
any_function(target);
//.............

//// NOW, I WILL set position...but this object has rotate css, I can't set it. the 

// Target.css({ x: 100, y:100 }); // is bad position..

// SO:
    // sort css [BEGIN]
    var raw = target.css('transit:transform');
    if (raw) {
        var bak = new Array();
        for (var k in raw) {
            if (raw.hasOwnProperty(k)) {
                bak.push({
                    key: k,
                    value: raw[k]
                });
            }
        }
        for (var i = 0; i < bak.length; ++i) {
            delete raw[bak[i].key];
        }
        raw.set('translate', 0, 0);
        for (var i = 0; i < bak.length; ++i) {
            raw[bak[i].key] = bak[i].value;
        }
        target.css('transit:transform', raw);

    }
    // sort css [END]

Target.css({ x: 100, y:100 }); // IS RIGHT