Jump to content
Search Community

First scrollTo

mikel test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Hi experts,


It's a little strange: Only the first scrollTo (button on hero) does not land correctly. After that, everything works as desired.


Everything is fine in the test case:


See the Pen BVNqxL by mikeK (@mikeK) on CodePen


In the finished web https://www.mandantum.com however not. I checked a lot.
But do not find the mistake that I have 'built in'.


Small hint, where to look, would be nice.


Link to comment
Share on other sites

In Safari 11 MacOS 10.13.6, I do see it on https://www.mandantum.com when clicking on "Ihr Projekt braucht Unterstützung ?" (as an example). First click scrolls to a lower position than any subsequent clicks which scroll to a higher (I assume "correct") position. Haven't picked apart the code yet ... because I just want to be sure this is specifically where you are seeing the isse, @mikel.



  • Like 2
Link to comment
Share on other sites

Hi friends,


@Shaun Gorneau : yes 'First click scrolls to a lower position than any subsequent'.


@GreenSock,  @PointC : Did that replace <a> with <div>. Locally the same phenomenon.


@Jonathan : CHROME / Windows. SAFARI shows me this 1st click mistake too.


Lets think about a loader doing the first 'run'.

Maybe scrollTo needs a little time to get to the right point.


Best regards



Link to comment
Share on other sites

Sorry, I thought we were looking at the harsh jump so I thought the <a> tags were the problem.


I think the wrong position on first click is because of the 'fixed' setting on the .nav. In your CodePen demo you have the .nav set to position:fixed in your CSS. As far as I can tell on your live site, the .nav is set to relative in your CSS. It tweens to position: fixed upon the first window scroll and stays that way so all subsequent clicks and scrolls are landing correctly.


I think by setting that .nav to position:fixed in your CSS, it should fix your issue.



  • Like 4
Link to comment
Share on other sites

Hi @PointC,


Great job. Thanks!  https://redmax.hamburg/MANsolved/


The .nav was fixed too, but that only happened after the 1st scrollTo started.


if($(window).width() >=600 ){	
	$(window).scroll(function(e) {
	  var scroll = $(window).scrollTop();
	  if (scroll > offset_Wert-nav-30) {
		TweenLite.to('.nav',0.5,{autoAlpha:1, position:"fixed"})
else if ($(window).width() <600 ){
	TweenLite.to('.nav',0.5,{autoAlpha:1, position:"fixed"})	

Best regards

  • Like 3
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...