Many Anchor Links in Main Menu for Single Page
-
Hi there,
I added three anchor links to my main menu like https://paulstolle.com/start#projekte
The first link is working smooth but the other two links are just jumping to the bottom of the page without a smooth transition.I tried different workarounds and ended up with the following code in my Custom <head> content :
<script> window.laytheme.on('newpageshown', function(){ if(window.location.hash.length > 0){ var id = window.location.hash; if(jQuery(id).length > 0){ jQuery('html, body').animate( { scrollTop: jQuery(id).offset().top }, { duration: 1200 }); } } }); </script>
Is there a solution that all links are directing to the locations where I set my id's?
Thanks in advance!
Paul
-
Dear @paulstolle
you did not give the div an ID with leistungen.
Best!
Marius -
Thanks for your quick response, @mariusjopen !
I set the ID leistungen to the horizontal line above Leistungen. But even if I set the ID in a div in the text-editing-window it is not working and just jumping to the bottom of the page.
The anchor links are also restraining the link to the main page if you click on Paul Alexander Stolle after clicking another menu-link.Any ideas why this is happening?
Best, Paul
-
Dear @paulstolle
can you try with a different word and make sure that everything is correct and also that the ID is not used twice?
Best!
MariusSorry… Just trying to isolate the problem…
-
Thanks for your help, @mariusjopen !
I changed the three IDs to projects, services and contact and the site name to home.
The menu links are set in Wordpress > Design > Menus as individual links like this:
https://paulstolle.com/home#projects
https://paulstolle.com/home#services
https://paulstolle.com/home#contactCan you work with this?
Best, Paul
-
Dear @paulstolle
well. The page is not long enough to scroll more down. The projects anchor works.
Best!
Marius -
Oh, I see … Thanks, @mariusjopen !
-
Dear @paulstolle
:-DBest!
Marius
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it