ScrollTo Plugin Error

[fmir86 0 Likes (Newbie)]

Hey guys, thanks in advance for the support.

 

Recently I choose GSAP ScrollTo Plugin to solve a situation on my site.

 

 

Basically I coded a window.onload function, that evaluates the url hashtag. The format of the hashtag is "#whatever_Details".

So, I take this hashtag and using the substr() method I isolate the part of the hashtag containing the name of the section ("whatever")

and concatenating "_article". The real id of the elements to target is this, they end with "_article".

 

I pass the "whatever_article" to the ScrollTo plugin 

 

This is the current script:

		<script>
			document.body.className = "stop-scrolling";
			window.onload = function(){
				document.body.className = "";
				var hashText, verticalOffset = 70;
				if(location.hash != ""){
					hashText = location.hash.substr(1, (location.hash.length - 9));
					TweenMax.to(window, 0, {scrollTo:document.getElementById(hashText + "_article").offsetTop - verticalOffset});
				}
			}
		</script>

However, It doesn't work. And in Chrome I get a weird error:

 

TweenMax.min.js:17 Uncaught SecurityError: Blocked a frame with origin ""https://www.google.com".  The frame requesting access has a protocol of "http", the frame being accessed has a protocol of "https". Protocols must match.

 

This error is fired infinitely.

 

On Firefox I get a recurrent error, but with a different description:

 

Error: Permission denied to access property "_gsTweenID"

 

This is the webpage with the problem:
http://fabianmiranda.com/beta/about.shtml

 

You can put "#experience_Details" at the end of the url, to test what i am describing.

 

The weird thing is that this code was actually working already on another section:
http://fabianmiranda.com/beta/portfolio.shtml#shirleygatgens_Details

http://fabianmiranda.com/beta/portfolio.shtml#zambuni_Details

 

Do you guys have any idea of what could be causing this problem?

 

Thanks!

 

[Jonathan 5,176 Likes (Superhero)]

Hi and welcome to the GreenSock forum!

 

Can you try and create a codepen demo so we can see if this can replicated outside of your website. Just so we can narrow down what is happening. Here is video tut on how to create a codepen demo example so we can better help you!

 

 

 

But please standby while we look into this

 

Thanks!

[OSUblake 9,990 Likes (Superhero)]

It's either Google Maps or your server SSI.

 

This works....

http://run.plnkr.co/5ek8tRkctPcgM26O/#section3

 

Here's the code.

http://plnkr.co/edit/EjMIU7X3jnIz7DZNpd8A?p=preview

 

EDIT: It looks like the URL for the preview always changes, so follow these steps.

• Click the tiny blue box in the upper-right corner. The tooltip will show "Launch the preview in a separate window".
• When the window opens up, copy the URL, but don't close the window as this will end the preview session.
• Open up a new tab and paste the URL and add "#section3" to the end.
• Press enter, and the page should load and scroll down to section 3.