jQuery animate queue: false not working to make animations simultaneous

I’ve used the jQuery queue modifier to make animations happen simultaneously before, but for some reason I can’t get it working this time.

The URL of the page in question is http://fretfast.com – when you click “notifications” at the top left, you’ll see that first the bar expands sideways and then the “notifications” bar expands to fit it, and the same thing happens with the height animation.

  • Intercept AJAX responses in Chrome Extension
  • How to get session variables from php server with Ajax function? (PHP HTML JS Ajax)
  • $http promise chain running in wrong order
  • Ajax form not calling uploadProgress
  • ajax, setRequestHeader(), Content-Type, application/x-www-form-urlencoded and charset
  • JSON plus spring mvc 3.2 error 415 (Unsupported Media Type)
  • Here is how I’m trying to do it:

    n.animate({width: em2px(35)+'px'}, {queue: false, duration: speeds['fast']/1.5});
    nc.animate({width: em2px(35)+'px'}, {queue: false, duration: speeds['fast']/1.5});

    Where n is the variable for the “notifications” title bar and nc is the variable for the notification container that expands first. Any idea what’s wrong?

  • HTMLUnit not working with AngularJS
  • How to set up a progress bar
  • How to send the dyanmically generated <tr> to the next page
  • Get List of Albums Google Picasa
  • Asynchronously sort GridView in ASP.NET MVC using Ajax
  • How to send value input type text via ajax post?
  • One Solution collect form web for “jQuery animate queue: false not working to make animations simultaneous”

    You probably have Transition properties in your CSS, on the selector you are trying to animate.
    Took me forever to figure this out, but apparently, CSS Transitions force the animation to either lag, or happen after all other animations, can anyone clarify or confirm this?

    Using jQuery animations and CSS animations together can be tricky, anyone have any insight into this? Tips?