scrollTo plugin and window offset top on animation end

[Oksana Romaniv 5 Likes (Newbie)]

Hello,

 

I'm using ScrollToPlugin to animate window position between sections.

 

The issue is the following. I'm trying to check the window offset at the end of the animation (window scrolled to correct position), but I actually get the $(window).scrollTop() BEFORE the animation in the onComplete callback. The example code:

 

   // Go To Slide functionality
    goToSlide(slideIndex) {
      //If the slides are not changing and there isn't such a slide
      let $slide = $($(this.slides).get(slideIndex));

      if (!this.isAnimating && $slide.length) {
        //setting animating flag to true
        this.isAnimating = true;
 
        //Sliding to current slide
        TweenMax.to(window, 0.5, {
          scrollTo: {
            y: $slide.offset().top,
            autoKill: false,
          },
          onComplete: this.onSlideChangeEnd(slideIndex),
          onCompleteScope: this,
          ease: Sine.easeInOut,
        });
      }
    }

 

The onComplete callback

 

    // Change animation status
    onSlideChangeEnd(slideIndex) {
      this.currentIndex = slideIndex;
      this.isAnimating = false;
      this.nextSliderIndex = undefined;

      this.updateCurrentOffset();
      console.log('this.offsets :', this.offsets);
      console.log('this on end :', this.currentTop);
      console.log('this on end :', $(window).scrollTop);
      console.log('vanilla :', document.documentElement.scrollTop || document.body.scrollTop);
    }

 

The logged window.scrollTop are the actual values when animation starts (previous section coordinates). When you scroll again - the value becomes accurate for the previous callback.

 

How can I get the window offset value after it was animated to a position via scrollTo plugin?

 

Thank you

 

[Carl 9,066 Likes (Superhero)]

The issue is that you are telling the function to execute immediately when you add the () at the end: 

 

onComplete: this.onSlideChangeEnd(slideIndex)
 

But you need to just pass a reference to the function and then pass the parameters separately in an array

 

onComplete: this.onSlideChangeEnd,
onCompleteParams: [slideIndex]

 

 

[Oksana Romaniv 5 Likes (Newbie)]

Thank you @Carl ! You're right! This solves my problem.