All Posts by Email, Once a Week

Media Temple logo

CSS-Tricks is brought to you in part by Media Temple, the web hosting that we both use and recommend.

Parallax count up scrolling

  • # December 11, 2012 at 2:14 pm

    Hello, i’am trying to use a parallax scrolling plugin to creat something like this . The hardest part is to increment the number like the one on the computer ( ). Do you guys having any ideas ? :/

    # December 12, 2012 at 8:27 am

    To me the easiest way would be to get the scroll value and put it through an algorithm to display that text, then write the text on window scroll. As it scrolls down the text can increment up until a max of 57% or however much. Something like:

    $(window).scroll( function() {
    var waypointPosition = 500;
    var scroll = $.scrollTop();
    scroll = scroll – waypointPosition;
    if (scroll > 57) { scroll = 57; }
    $(‘#percentage’).text(‘%’ + scroll);

    I haven’t tested it so that might not work – but could give you some ideas.

Viewing 2 posts - 1 through 2 (of 2 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