Hello,
I have a couple objects within a div. They each have a click handler to modify their transform property when clicked. That handler is also removed and another one added at that time. When they are clicked again, their transform property then is changed again back to the original settings. -basically making the elements 'zoom' in and out of the page.
I'm doing:
TweenLite.to(element, 1, {
transform: 'translate3d(0,0,0)',
webkitTransform: 'translate3d(0,0,0)',
mozTransform: 'translate3d(0,0,0)'
});
to move them out. I save their initial position with jQuery's data(). I then move them back with click with:
TweenLite.to(element, 1, {
transform: element.data().transform,
webkitTransform: element.data().webkitTransform,
mozTransform: element.data().mozTransform
});
This works great! And it works in FF, Chrome and Safari.
The 'problem' is, in FF I get a console log of 'invalid webkitTransform tween value: undefined' and in Chrome and Safari 'invalid mozTransform tween value: undefined'
Now given, these properties do not exist in the other browser, so I can see why this is thrown. But is this a bug or intended? Since everything works and it's just a dev console log, it doesn't really affect anything, but is there a way to avoid these logs? I need to change both css properties '-webkit-transform' and '-moz-transform' to ensure my functionality forks in all browsers, but it seems like GSAP does not like me altering both/all properties.
Or is there another way I should be tweening these properties to avoid this log error?
Thanks!
