Home/ Questions/Q 7192761
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-28T20:00:47+00:00

RESOLVED: CSS Animation/Scale issue in Chrome/Webkit I asked this question previously, but I’m not

  • 0

RESOLVED: CSS Animation/Scale issue in Chrome/Webkit

I asked this question previously, but I’m not sure if it was clear. I’ve done a ton of troubleshooting since to no avail. So I’m back w/ a play-by-play hoping for some help.

  1. Using JS, on doc ready, I remove the class that hides the image and add logoAnim which sets the object in motion.

  2. The object should drop in with a simultaneous scaleY(2) effect- an oozing/drip effect.

You can see the correct effect in the JSFiddle link via Firefox/Moz, however it doesn’t work in Chrome/Webkit. Looking at the Firebug code in FF, the ‘-moz-animation:2s ease 2s normal none 1 ooze’ appears in the CSS of the ‘.logoAnim’- it doesn’t appear in the webkit version in Chrome.

Am I missing something? Is structure/order of the css important in webkit?

http://jsfiddle.net/AfDwu/5/

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    This problem has been resolved by DuoPixel: CSS Animation/Scale issue in Chrome/Webkit

    You are not specifying the properties of the -webkit-animation, only the name.

    Replace: -webkit-animation-name: ooze

    With: -webkit-animation: ooze 2s 2s ease-in-out;

    And it will work.

    • 0