The Lodge is members-only design/dev videos and Office Hours.

Next Office Hours Session: "Programming Fundamentals" Dec 02 - 2:00 PM Eastern

How to trigger several animation after user scroll to N points – jQuery waypoints

  • # May 2, 2013 at 11:03 am

    I need your help!

    Basic idea: I want when user scroll to one point (in the middle of the pages – let say it’s 500px from top) then we have some animation, of course I won’t ask how to do all the animation stuff, but I will need you to give me the basic idea about the callback

    Callbacks that I mean: after 1st animation, we get 2nd animation, then 3rd animation. How I approach this?


    Let say we have 4 boxes, and they have color red, blue, orange and pink.
    After user scrolled to 500px from top – I want first red box fadein
    2 seconds from that, I want the red box fadeOut, and blue box will fadein.
    in my original idea, I will need them to rotate or some other animation – if you could do this too it will be great , please ignore this point if you think I’m asking too much

    jQuery waypoints
    maybe jQuery transit ?

    Please, let me know if your code is good for the best practices

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed