Streaming live at 10am (PST)

Overflow hiss fail during transition

Hi all,

I have an image in a block with rounded corners and overflow hidden. On hover img scales to 1.2. On mouse out it scales back to 1.0 (note: why no animation out?).

During animation the block looses it’s overflow hidden and applies it on animation end.

See it live


Hey @MartinB, try adding the transition to the normal class instead of the hover class. When you add transitions to hover classes, CSS get’s a little funky. Let me know how that works.

That will fix the transition on mouse out, but not the overflow animation. Still working on that part.

A workaround is having a background image inside a div that has rounded corners - when hovered, the background image size is increased. Transition would still have to be added to the non-hover class.

Thanks, I’ll give it a try. But how to trigger on-hover if you don’t use a hover class?

I mean you can use a hover class, just don’t add a transition to it. Add the transition to the normal class.

Ah! Ok… thanks for the quick response.