Hacker News new | ask | show | jobs
by harrisonpowers 4678 days ago
Spent some time yesterday converting jQuery fadeIn/fadeOuts to CSS3 animations and ran into an issue.

Changing the display style (display:none; to display:block;) disables CSS animations and transitions. There are workarounds - setting height to 0 and switching to auto, then animating the opacity - or moving the element off the screen.

Took me a while to figure out why my simple animations weren't working... I had gotten used to display:none; not sure how I feel about height:0;

1 comments

Created a small script to take care of this. Hopefully someone else finds it useful.

https://github.com/fijimunkii/CSS3.fadeIn.fadeOut.js