Scroll to anchor

---

Hello Armin, hello Forum.

I have the following problem: I have created a way to jump to anchors from the Lay Theme menu on a customer's website. Now I need to fix that solution for sub pages (projects) as well. My workaround was to have a "zurück"-Button in the menu which leads back to the home page. But my customer wants that link to jump to the anchor again…

So my questions are:

1. is it possible to have my menu work on all pages? So no "zurück"-Button would be necessary?

2. or is it possible to make the "zurück"-Button jump to that anchor again?

Here is my code:

<script>
jQuery(document).ready( function() {
jQuery('a').addClass('scroll-to-anch');
});
</script>

<script>
jQuery(document).ready(function(){
jQuery('body').on('click', '.scroll-to-anch', function(event) {
event.preventDefault();
var id = jQuery(this).attr('href');
jQuery('html, body').animate( { scrollTop: jQuery(id).offset().top }, 750 );
});
})
</script>

Thank you and regards!
Arne

Hi Arne!

Without seeing the website it is difficult to help. Can you upload it on a test server?

Are you aware of this:
http://laytheme.com/documentation.html#custom-javascript

Because your Lay Theme website is a "Single Page" JavaScript application you cannot just use jQuery(document).ready(…) to execute your js because the ready event only fires once when the website loads the first time.

Let me know!

Best!

Marius

@mariusjopen Hi Marius.

Oh yeah, I forgot the link in my first post, here we go: http://theartofmanagement.org/wp2017/

Yes, I know about the single page js-solution and I have read the documentation. Fiddling around with scripts didn't work out so far so I need help to get me on the way. Since my anchor menu basically works I have hopes to expand it to one of the solutions from my original post.

Thanks and regards,
Arne

@mariusjopen Did you have time to look at my problem yet? Any ideas? Thank you!

Hi Arne,

ok. I got what you mean.

1. is it possible to have my menu work on all pages? So no "zurück"-Button would be necessary?

I would try to use the default way to use anchorpoints within the projects. Have a look here: http://www.echoecho.com/htmllinks08.htm

2. or is it possible to make the "zurück"-Button jump to that anchor again?

This would be a tricky one. but possible.
There is a thing called Javascipt History.
https://wiki.selfhtml.org/wiki/JavaScript/History

It saves informations of the page you were coming from.
But I am not sure how easy that will be to implement.

I hope that helps!

Best!

Marius

@mariusjopen Hello Marius,

I tried your first solution but this doesn't work. If I remove the JavaScript from the menu links every anchor link will open a new window/tab but won't scroll to the section of the page.

I already considered the second option but I gues that would only bring me back to my main page and not scroll to the anchor.

I would need a script that does the following:

1. jump to the main page and load it
2. when loaded scroll down to the respectable section

Hmmm, that should be possible, don't you think?

Regards, Arne

Hi Arne!

Did you try this solution?
http://laythemeforum.com:4567/topic/947/scroll-to-anchors-with-fullscreen-slider-addon-back-to-top-button-doesn-t-work/2

Best!

Marius

@mariusjopen Yes, I had a look at that. But that solution only works on one page but doesn't solve the problem of getting from a project page back to the main page (and scroll down)…

Hi Arne,

I think there is no clean solution for this. You will have to find a workaround.

I tried this and it worked:
I created a link like this in a html textbox in the gridder:

<a name="chapter4"></a> 

Then I added #chapter4to the end domain and it jumped down to the anchor.

You will probably need to build an extra navigation which has the ````#ancors````` in the end of the url.

Like in the example I sent you in the beginning.

I hope that was not too confusing :-)

Best!

Marius