Let anchor section act like a normal website

Question

this is a bit tricky to explain: We got a website that contains various menus and apart from normal links it also has anchorlinks. Now it's not the problem to have the links generated there, but it is also desired to give them an "active"-state (= you're on that website), specifically when you jumped to that section.

<ul class="active">
  <li class="active">
    <a href="index.php?id=30">Subsite</a>
    <ul>
      <li><a href="index.php?id=30#section_1">Section 1</li>
      <li><a href="index.php?id=30#section_2">Section 2</li>
      <li><a href="index.php?id=30#section_3">Section 3</li>
      <li><a href="index.php?id=30#section_4">Section 4</li>
    </ul>
  </li>
</ul>

Normal link behaviour:

You're on home, you click in the menu and get to index.php?id=30 When you're on id=30, the menu point will highlight.

How an active anchor should behave:

You're on home, you click in the menu and get to index.php?id=30#section_1. When you're on id=30, it's not highlighted, but when you follow the link and are on id=30#section_1, it is (based on what is entered in the locationbar). When you remove the anchor in the locationbar and confirm, the highlighting should be removed (afaik, the website won't reload, but jump to another section).

Is it possible to react to this jump-behaviour and listen to changes done to the location bar? Or do you have a different idea how to achieve this?

There's more information on how to achieve this here: http://stackoverflow.com/questions/680785/on-window-location-hash-change — Marc Baumbach, Jan 21 '13 at 14:09
Can you post the code you are using to do this? Specifically, the code that checks "what is entered in the locationbar"? — Charles, Jan 21 '13 at 14:09
onclick you could add a css-class with javascript to fake that behaviour — john Smith, Jan 21 '13 at 14:12

score 0 · Accepted Answer · edited May 23 '17 at 11:52

0

As Marc Baumbach pointed out in the comments-section to my question, this is exactly what I was looking for:

On - window.location.hash - Change?

edited May 23 '17 at 11:52

Community

1
1

answered Jan 21 '13 at 16:03

user828591

1,212
2
17
32

Let anchor section act like a normal website

1 Answers1