[Tweening inherited values]

Hi Jack,

 

you are the hero! Thank you very much. That solves the problem.

 

I know it wasn't a bug - it was just a missing 'nice to have'. And now it is there

 

Cheers.

[Tweening inherited values]

I have found a solution (or rather a workaround). It is using CSSRule plugin

 

var rule = CSSRulePlugin.getRule("p");
var ruleTxt = rule.cssText.replace("; ", ",").replace(";", "");
var properties = ruleTxt.split(',');
var obj = {};

properties.forEach(function (property) {
    var tup = property.split(': ');
    obj[tup[0]] = tup[1];
});


document.getElementById('button').addEventListener("click", function () {
    TweenMax.to("#parent", 1, {
        className: "-=alert",
        onComplete: cleanUp
    });
    TweenMax.to($("#parent p"), 1, obj)
});

function cleanUp() {
    //removes ALL inline styling
    $("#parent p").attr("style", "");
}

 

 

Working sample here: http://jsfiddle.net/ESS4c/1/ Can it be done smarter/prettier? Also, if the content of the parent element is complex this solution would produce quite long code...

[Tweening inherited values]

Hi,

 

I am wondering if it's possible to tween children elements just by setting class name of a parent element.

Just in case the question is not clear I have prepared a JSFiddle to illustrate the problem:

 

http://jsfiddle.net/ESS4c/

 

The goal is to have paragraph text nicely animated between both states. Is that possible?