Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove string after anchor completely for IE8+ #98

Open
ghost opened this issue Jun 4, 2016 · 1 comment
Open

Remove string after anchor completely for IE8+ #98

ghost opened this issue Jun 4, 2016 · 1 comment

Comments

@ghost
Copy link

ghost commented Jun 4, 2016

Using your great polyfill with IE8 on in-page anchor links like this.

    // looking for all the links and hang on the event, all references in this document
    $('.menu-a').on('click', function() {

        // keep the link in the browser history
        history.pushState(null, null, this.href);

        alert('history set ==>'+this.href); 

        // do not give a default action
        return false;
    });

    // hang on popstate event triggered by pressing back/forward in browser
    $(window).on('popstate', function(e) {

        // just post
        alert("We returned to the page with a link: " + location.href);
    });

When I click on the in-page anchor link, .menu-a in IE8 it adds a / to the URL hash like this for example.

domain.com/#/anchor

Now when I click the back or forward button in IE8 it will not find the anchor and go back to top of page instead of to the section. This is because the / is added after the anchor by default.

How can I please completely remove the / after the anchor so that when I click an in-page anchor link in IE8 it will become this.

domain.com/#anchor

I am trying to make a single page anchor navigation that also works in IE8 with remembering the URL hash for each section so that when the user clicks back and forward button the page actually scroll to the correct section.

For example when I try to have ?type= empty it does not stay empty but adds the /.

<script src="js/vendor/history.4.2.7.min.js?type="></script>

It would be great if for IE8 I could somehow tell your code that I do not need an extra string after the anchor.

Thank you very much for your help.

@ghost
Copy link
Author

ghost commented Jun 4, 2016

I changed the history.js default settings to this removing the / inside the "type": '/',

  // default settings
  var settings = {"basepath": '/', "redirect": 0, "type": '', "init": 0};

Now it works.

Interesting observation. I am using Velocity.js to animate the scroll to the anchors. When I click the back button IE8 smoothly animates the scrolling to the correct section, however when I click the forward button IE8 jumps to the section straight ahead without animating the scrolling. No idea why but for now I am happy history and browser back and forward buttons work well in IE8.

Thank you for this!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

0 participants