Problem/Motivation

Avoid scroll before page load.

Steps to reproduce

  1. Create 2 pages containing the same HTML ID
  2. Link the anchor from 1 page to the other (with an A tag with hashtag)
  3. Click that link and notice you scroll to the anchor on the same page before the new page loads and you scroll to the anchor on that page

Proposed resolution

Adjust scroll behaviour JavaScript binding condition.

Remaining tasks

Incorporate this code change.
In components/00-theme/00-base/06-scripts/01-base.js
remove

        // the url, minus stuff after hash or parameters
        var currentUrl = window.location.href.split(/[?#]/)[0];
        // the path, minus stuff after hash or parameters
        var pathBase = path.split(/[?#]/)[0];

        // if path points to current page, prevent reload.
        // meaning, if the url's (stripped of hashes and parameters) match up,
        // we're on the same page and don't need a page reload
        // if (currentUrl.indexOf(pathBase) !== -1) {
        if (currentUrl.replace(/\/$/, "") == pathBase.replace(/\/$/, "")) {
          e.preventDefault();
        }

but add

      // the url, minus stuff after hash or parameters
      var currentUrl = window.location.href.split(/[?#]/)[0];
      // the path, minus stuff after hash or parameters
      var pathBase = path.split(/[?#]/)[0];

      // if the URLs (stripped of hashes and parameters) don't match up, it's
      // a link to a different page.
      // don't scroll to anchor on same page on click.
      if (currentUrl.replace(/\/$/, "") !== pathBase.replace(/\/$/, "")) {
        return true;
      }
      // we're on the same page and don't need a page reload
      e.preventDefault();

to the top of

    $('a[href*="#"]').not('a[href="#"]').once('js-once-scrollable-anchors').each(function() {

which does a bit more than the original code.

User interface changes

No more scroll before page load.

API changes

None.

Data model changes

None, AFAIK.

Comments

rembrandx created an issue. See original summary.

  • rembrandx committed 8f25352 on 3.x
    Issue #3224494 by PieterDC: Don't scroll on current page if anchor is on...

  • rembrandx committed 7b10d81 on 2.x
    Issue #3224494 by PieterDC: Don't scroll on current page if anchor is on...
rembrandx’s picture

Status: Needs review » Fixed

Updated in v3.2.2 & v2.2.8

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.