animation: swing broken in Chrome release - how to fix? (Version 72.0.3626.96) 2019

Starr Duskk
Starr Duskk used Ask the Experts™
on
I have a children's website, where i have a boat rocking back and forth.

http://arkiteks.us/

This latest update to chrome Version 72.0.3626.96 broke it so the entire screen rocks back and forth.

.swing {
    animation: swing ease-in-out 1s infinite alternate;
    float: left;
    transform-origin: bottom; /* have boat rock instead of swing */
}

Open in new window


Firefox works fine, but Chrome will give you seizures.

Any suggestions?

thanks!
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Most Valuable Expert 2017
Distinguished Expert 2018

Commented:
I just checked my Chrome

Google Chrome is up to date
Version 72.0.3626.96 (Official Build) (64-bit)

Open in new window


I can't replicate - works fine for me.

Maybe you are running a cached version

Try adding ?ver=fixme to the url
http://arkiteks.us/?ver=fixme 

Open in new window

I'm going to take a guess here, that Starr Dusk - you're viewing on a maximized 1920x1080 monitor, and Julian is not.

The boat itself is the only thing rocking, but on a maximized Chrome window, with the bookmark bar on, the boat keeps dipping JUST underneath the bottom of the screen as it rocks, popping a scrollbar on the right of the screen, and then jumping the entire area horizontally by just a touch.

You need to play with the overflow on the body.
"overflow: scroll" will make the scrollbar there regardless of height, and will just enable it when needed.
Starr DuskkASP.NET VB.NET Developer

Author

Commented:
Thanks so much!

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial