mcarlson

This issue no longer exists for me on Mac OS X Sierra on updated Firefox 51. Give it a try on update Firefox.

https://bugzilla.mozilla.org/show_bug.cgi?id=1277598

Yes, I've tried quite a few things and nothing has worked. I will have to remove animation for this element until the bug is fixed in FF.

Thanks for the reply. Here is an updated codepen. http://codepen.io/mcarlson/pen/oLgyza The problem still repros with background-size: 100% 100%. (Also, this skews the image.) I think Firefox must not be calculating percentage based background sizes until after it repaints. If the size of the element is set in pixels rather than % or vw, the problem does not exist.

I am encountering this as well. Yes, it appears to be a FF bug on Mac only. I have a div with background image set to background-size:cover. Same basic layout and css as the example from hanslibuzli. While the scale animation is running, the image expands outside of its 100% width. After the scale animation is complete, the size is correct. It's only while the animation is in progress that the size distortion is happening. And it only happens with background-size:cover as far as I have been able to tell. No issue with background-size:contain for example. I believe this is a Firefox bug with background-size:cover. Here's one additional thing I have found: in my case, the problem only happens on a Retina screen. If I hook up an external non-Retina (1:1 pixel ratio) screen to a Mac and move the FF browser over to that screen, the background image animates scale properly throughout the animation. But on a Retina screen (FF only), the background image is mis-sized during the animation. Possibly it happens with similar dppx/pixel-ratio screens as well, but I've only tried Retina. I have not found any workaround yet and this really seems to be a FF bug (not GSAP bug), but I wanted to add this Retina fact to the topic in case it triggers any ideas for workarounds. Again, not a GSAP bug so no expectation for a GSAP fix. But if anyone has ideas for workaround, that would be greatly appreciated. Thanks for reading. Repro'd on: OS X 10.10.5 (Yosemite) with Firefox 46.0.1 OS X 10.11.4 (El Capitan) with Firefox 46.0.1