fraenzn

Sorry for hijacking this thread, but I've been unsuccessfully trying to import the Draggable utility in my Webpack project like this, thinking the syntax would be the same as it is for the plugins: import Draggable from 'gsap/utils/draggable' Which leads to Module not found: Error: Cannot resolve module 'gsap/utils/draggable'. What's the correct way to go about this?

Hey Diaco, thanks for checking it out! Interesting, is that syntax documented somewhere? It did change something, but unfortunately it's only that now TweenMax sets the starting value to 50% 50% on every Tween instead. What I want is the current value at the beginning of the tween. I did some digging: TweenMax seems to convert the property to "-webkit-perspective-origin-x" and "-webkit-perspective-origin-y" behind the scenes, and tweening those directly seems to work where tweening -webkit-perspective-origin doesn't. Strange. So for now I'm doing this, which is unfortunate, but does work in both browsers: if (this.$options.isSafari) { gsap.TweenMax.to(this.$el, 0.7, { "-webkit-perspective-origin-x": x + '%', "-webkit-perspective-origin-y": y + '%' }); } else { gsap.TweenMax.to(this.$el, 1, { perspectiveOrigin: x + '% ' + y + '%' }); } I wish there was a better way of doing this, but it seems that the perspective-origin property is somewhat of an edge case for GSAP? Cheers, Franz

tl;dr: TweenMax + Safari can't read the value of perspectiveOrigin, can set it just fine. Hi, happy customer and big fan here. I'm working on a project where I'm trying to tween the perspective-origin CSS property. It works just fine as long as I TweenMax.set() it, but it breaks in Safari when I change it to TweenMax.to(). Both scenarios work in Chrome. It looks like TweenMax is unable to READ the property's current value when in Safari, which it needs for calculating the tween. It is able to WRITE the value though. If you take a look at my Codepen, switch the method to "to", move the mouse and then hold still for a bit you'll see that the value gets set to the tween's end value as soon as the tween ends. Which is also why TweenMax.set() works just fine, because it doesn't need to read a value, only set it. Any idea how I can get around this without manually checking for browsers and juggling with vendor prefixes? Thanks a bunch, Franz