Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript CountUp on Scroll

  • This topic is empty.
Viewing 1 post (of 1 total)
  • Author
    Posts
  • #188311
    Romchick
    Participant

    Guys ,want my countup to work when it appears on viewport. How to build the code right. Cuz this code works fine, but with an issue: it stops to count when I scroll and when stop – continues to count. Where to search ?

    
    $(document).ready(function() {
     $(window).scroll( function(){
    
    $('.counter').each(function() {
      var $this = $(this), countTo = $this.attr('data-count');
      var bottom_of_object = $(this).position().top + $(this).outerHeight();
      var bottom_of_window = $(window).scrollTop() + $(window).height();
    
    if( bottom_of_window > bottom_of_object ){
    
    $({ countNum: $this.text()}).animate({
        countNum: countTo
      },
    
    {
    
    duration: 8000,
    easing:'linear',
    step: function() {
      $this.text(Math.floor(this.countNum));
    },
    complete: function() {
      $this.text(this.countNum);
      //alert('finished');
    }
    
    });
      }
    });
    });
    });
    
Viewing 1 post (of 1 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.