Anchor links scrolling to incorrect position ONLY if starting at the top of page

  • Resolved bonnieg77

    (@bonnieg77)


    6 years, 2 months ago

    My team has decided that this site navigation will be dependent on using anchor links in each drop down menu, so I am trying to troubleshoot the General Info menu first. At first the anchor links were scrolling to the incorrect position due to the sticky header/menu, but I fixed that with css code that points the anchor to a location slightly above the section *.anchor { position: relative; top: -160px; }
    * However, IF you start at the top of the page and click a link in the dropdown to go to an anchored section on THAT same page, the position is incorrect- it is once again covered by the sticky nav (is something overriding the custom -px code?) For example, if you are at the top of GENERAL INFO and you click on SCHEDULE, the anchor links to the wrong (lower) position on the page. But if you then click on TRAVEL (from SCHEDULE section, or anywhere else on the site other than the top of GENERAL INFO), the anchor links to the correct position. If you are anywhere on the page that is NOT the top (or any other page on the site) the anchor links navigate to the correct position, per the -px code. This is especially troubling if you are navigating to the top of the page (HOW IT WORKS) and then want to go to SCHEDULE or TRAVEL and it keeps scrolling you incorrectly. How can I make the anchor links work correctly from top of the page?

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

Viewing 3 replies - 1 through 3 (of 3 total)
  • Theme Author Archimidis Mertzanos

    (@archimidism)

    Dear @bonnieg77.
    You are asking something that is beyond this theme features and Potential. If you want to add some very advanced or unique features sometimes it is required to hire a professional developer.
    This theme is very developer friendly, however you are asking something beyond the theme’s scope.

    Thread Starter bonnieg77

    (@bonnieg77)

    hello, I have enlisted the assistance of a professional developer. He has identified the issue as relating to the javascript associated with the sticky navigation- to my understanding, the js controlling the sticky nav pops it into place (over the top of the anchor section) if the viewer has not yet scrolled in the page (which is why it only occurs when starting from the top of the page). In order to fix this, he needs to access the js which controls the sticky nav – would you be able to tell us exactly where this is located? I don’t think it is accessible within the WordPress dashboard, so I’ve downloaded the site files but do not know where this particular code is located (I assume in the theme files?) so that we can edit it. You mention the theme is very developer friendly, so any assistance in how my developer can best access/edit is greatly appreciated. Thank you!

    Theme Author Archimidis Mertzanos

    (@archimidism)

    Dear @bonnieg77 thanks for contacting me. Actually the sticky nav is a combination from css and js.
    The main file is the ms-dist.js which is located in the theme-directory / assets / js folders.
    However if you want something more custom you can assign your dev the following task.

    He/She could use one jQuery plugin like https://github.com/cferdinandi/smooth-scroll or many others and implement it with the theme.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Anchor links scrolling to incorrect position ONLY if starting at the top of page’ is closed to new replies.