CSS Keyframes Animation or Jquery Animations?

[Anonymous]

I’m going to start the next step in my new project and am stuck between the choice of using CSS keyframes animation and using jQuery .animate(). The animation is simple. There are 4 panels and each expands when the user hovers over it. And elements inside that panel slide in as well,and text fade in and out. I created a jquery version here http://codepen.io/Jarolin/pen/jGHcC

the :hover part will be easy with CSS but not the element slide in and text fade. So should i use Jquery for everything including the expanding on mouseenter animation, or should i use :hover to expand the panels and then jquery for the slide in animation and text fade. Also IE8 does not support CSS :hover but it does support Jquery. It’s also a question of which runs smoother.

[CrocoDillon]

For browser support (keyframes IE10+ right?) alone I’d go with jQuery. By the way, you can clear the animation queue with `.stop()`.

[Anonymous]

@CrocoDillon just finished it with Jquery and it’s working well. Thanks

[Author]

Posts