[Trouble getting ScrollTo to work properly]

46 minutes ago, ZachSaucier said:

This is not much of a GSAP question, but it's straightforward so I will help. First off, you've got a lot of errors in the console - jQuery not being defined being the most common one. You should fix those  

 

The issue is that you're trying to apply the click listener to an <object>. There are several options you could use. I personally recommend just using the <svg> directly  

 

Side note: if you find yourself using long selectors like '#overlaymenu div:last-child object' you should probably add an ID or class to reference instead.

 

It's best if you recreate errors like this in a CodePen going forward. That way it's much easier for us to debug and is able to be viewed by people viewing the thread later.

 

Hey Zach, thanks for the advice. I'm still fairly new to frontend development, so please pardon my spaghetti css haha. I'll keep non-GSAP questions somewhere else.

[Trouble getting ScrollTo to work properly]

@ZachSaucier

 

Going to my personal site, http://hauscloud.me, I can't figure out why my object / svg element is not firing off it's click event. I'm trying to make the overlay disappear using GSAP when clicking on the X button. You can see the overlay by clicking on any of the projects. The event listener is binded on line 62 in the JS file. I've tried messing with z-index and pointer-events to no avail.

[Trouble getting ScrollTo to work properly]

2 minutes ago, ZachSaucier said:

Thanks for the example. It's not scrolling because your document isn't scrolling. Your body is. So using the below instead fixes the issue:

gsap.to(document.body, {duration: 2, scrollTo: 400});

Alternatively, remove overflow: auto; from the body.

 

Hey thanks, that worked! I knew it was something fundamental I was missing. I'm still pretty new to JS so again, thanks. Looks like I need to read up more. Also side question, are there resources you would recommend to learn vanilla JS ? I've heard everyone should learn vanilla then move onto a framework or library.

[Trouble getting ScrollTo to work properly]

@ZachSaucier

 

Unfortunately not. I have the website deployed via flask and AWS eb. I don't think a minimal demo is necessary just because the project is already so small and simple (except for my css file aka garbage). Below is the link.

 

http://hauscloud-dev.us-east-2.elasticbeanstalk.com/home

 

@elegantseagulls 

 

Hey thanks for the tip! Tried it, but doesn't quite get the scroll to work 😅

[Trouble getting ScrollTo to work properly]

Hi Zach,

 

Thanks for the warm welcome. I checked that the selector and event using an alert after the gsap line, seemed fine. Attached is my console and my script order. I don't think source maps would be the issue and putting my js file after the CDNs seemed intuitive. 

 

[Trouble getting ScrollTo to work properly]

Hi everyone, I'm new to GSAP and having a bit of trouble getting the ScrollTo to work properly. I have gsap and ScrollTo CDN at the bottom of the body. Below is pretty much all I have in my JS file. I'm guessing I missed something in the docs just because it seemed so simple to implement GSAP.