wadhi
(Tanuj)
October 30, 2015, 1:37pm
1
When I use an anchor point from an external link, i.e., www.example.com#anchor , the page does not scroll to an anchor.
In the attached file, the button can be used to go the anchor. But if i use the same link in a new tab, it doesn’t jump to the anchor. (Same thing happening in the live environment)
example.hype.zip (10.5 KB)
Any help would be appreciated.
Thank You!
Daniel
October 30, 2015, 6:11pm
2
This is likely because the anchor does not exist on that page, since the HTML is rendered later (when the Hype document loads).
You’ll need to run this function On Scene Load for your first scene:
var hash = location.hash.substring(1);
if (hash.length > 0) {
document.getElementById(hash).scrollIntoView();
}
It gets the ‘#hash ’ portion of the URL if there is one, and then jumps to that position.
1 Like
wadhi
(Tanuj)
October 31, 2015, 9:05am
3
Hi @Daniel
Thanks for your help. That works on the example document, but it doesn’t seem to work on the project I’m working on.
My website (not this page though) uses # to redirect to a scene from an external link as well. Could that be a problem?
wadhi
(Tanuj)
October 31, 2015, 3:54pm
4
Just an update:
var hash = location.hash.substring(1);
if (hash.length > 0) {
window.location.href='#'+hash;
}
The change from document.getElementById(hash).scrollIntoView(); to window.location.href=’#’+hash; worked for me.
Also, I needed to add top value in CSS for my Sticky Navbar to not glitch.
.sticky{
position: fixed !important;
top: 0 !important;
}
Once again, thanks for your help! @Daniel
2 Likes