Dgameman1
Dgameman1

Reputation: 378

How can I make the URL not add # and the ID when I go to an anchor

I have a piece of code

<li><a href="#two" class="button" id="Button123">Text</a></li>

When I click this, my page goes down to

<section id="two" class="wrapper style3 fade-up twoSection">

Which is good, but now the url has

/#two

added onto it, how can I prevent the id being added to the URL?

Upvotes: 2

Views: 36

Answers (1)

dfsq
dfsq

Reputation: 193261

You would need to manually scroll (check Element.scrollIntoView method) document and also prevent default. Maybe something like this:

document.querySelector('#Button123').addEventListener('click', function(e) {
    document.querySelector(this.getAttribute('href')).scrollIntoView();
    e.preventDefault();
});

Demo: http://plnkr.co/edit/aFiE3GrlSb9MiK5qLeeY?p=preview

Upvotes: 4

Related Questions