Conflict with Anchor menu with full links

  • Resolved Ludwig

    (@sksjkj3)


    1 year, 9 months ago

    Hello,

    I have a website where the active item is highlighted when navigation reaches top of each section and I use the smooth scroll effect. Its the same as in this post: WordPress.org/support

    I use the following Custom CSS: 

    #ps2id-dummy-offset{
	height: 155px;
}
a.__mPS2id._mPS2id-h.mPS2id-highlight {
	color: #CCA876 !important;
}
a.__mPS2id._mPS2id-h.mPS2id-highlight:before {
    width: 100% !important;
}

.mPS2id-target-last{
	color: #CCA876 !important;
}

.menu-item a:not(.mPS2id-highlight){
color:#FFFFFF !important;
}

.menu-item a:hover {
	color: #CCA876 !important ;
	background-color: #71706C ;
	border-radius: 30px;
}

    Everything works great if I only write the hashtag in the custom menu links, e.g. #Kontakt (in englisch: #contact).
    But unfortunately it doesn’t work when I put the full link there, e.g. ludwig-kanzlei.de/#Kontakt. I have to use the full link because I want to use the menu on another page as well. I also put in “ps2id” in the css classer of the custom menu.

    I would be very grateful for help. Thank you

    • This topic was modified 1 year, 9 months ago by Ludwig.

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author malihu

    (@malihu)

    1 year, 9 months ago

    Hello,

    Your links URL should all start with either https:// or simply / because your web server redirects all non-SSL requests (right now your links use http://).
    In addition, there’s seems to be another script in your theme that handles page smooth scrolling.

    In order to fix both issues, change all your links URL to be using the root-relative URL type. For example, change your “Rechtsgebiete” link URL from either:

    http://ludwig-kanzlei.de/#Rechtsgebiete
    or
    https://ludwig-kanzlei.de/#Rechtsgebiete

    to:

    /#Rechtsgebiete

    Starting links with / assumes to start from the root folder (i.e. domain name) of the site.

    Do this for all your links (/#Kanzlei, /#FAQ etc.) and everything will work correctly.

    Let me know

    Thread Starter Ludwig

    (@sksjkj3)

    1 year, 9 months ago

    Its working! I’m really thankfull. Didn’t know its that easy..

    Another short question: If I’m on the other side (for me: “Aktuelles”) and then click on an anchor in the anchor menu, it jumps to the correct section, scrolls again to the top of the page and again back down to the section.

    Is it possible to change that?

    Plugin Author malihu

    (@malihu)

    1 year, 9 months ago

    You’re welcome.

    It’s not really possible to change the jump behavior as it depends on the browser’s engine, caching and page layout. Most of the times this jump does not occur and the page simply starts and scrolls right from the top but sometimes (as in your case) this issue happens.

    You can’t really do much about it other than disabling the smooth scrolling effect and let the browser jump straight to the section without the smooth scrolling from the top (when coming from a different page). If you want to do this, go to plugin settings and uncheck “scroll from/to different pages” option. Save changes and test.

    Thread Starter Ludwig

    (@sksjkj3)

    1 year, 9 months ago

    Thanks again, you’re the best. Everything works good now.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Conflict with Anchor menu with full links’ is closed to new replies.