Grow your CSS skills. Land your dream job.

CSS Keyframes Animation or Jquery Animations?

  • # April 30, 2013 at 6:13 pm

    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.

    # April 30, 2013 at 6:45 pm

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

    # April 30, 2013 at 8:42 pm

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

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".