Nav li redirects to another section in another page

Question

I have two html pages in two different folders, they both have the same navbar, lets suppose they're named page1 and page2, i want the nav li's in page2 to redirect me to a specific section in page1, how can i do that?
i tried this but it didn't work:

<a href="../foldername/page1.html#sectionid"></a>

you can use https://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_scrollspy&stacked=h — Avihay m, Apr 25 '17 at 12:38
what you posted above should already work. what's the problem? — Johannes, Apr 25 '17 at 12:49
@Avihaym answering questions about completely different subjects (like here) with "use bootstrap" really doesn't help anyone... (the question is about links - bootstrap has nothing to do with links) — Johannes, Apr 25 '17 at 12:52
@Johannes it's not working, im using scrollspy as well so i want it to go to the section in the other page then scroll down to the given section but its not going anywhere it stays where it is — jissylarry, Apr 25 '17 at 12:56
ah, okay. Most likely scrollspy is preventing the default action of jumping to the anchor. Does it go to the top of the page or directly to the linked section (without scrolling)? — Johannes, Apr 25 '17 at 12:59
@jissylarry I had a similar question once here http://stackoverflow.com/q/36137841/5641669 and got a useful answer. However, I didn't use scrollspy, but Scrollmagic. Maybe you can use that solution anyways... — Johannes, Apr 25 '17 at 13:01

score 0 · Answer 1 · answered Apr 25 '17 at 12:38

0

You need to set up an HTML element with id="sectionid" in the page 1 in order to the HTML bookmark to work. For example:

<h2 id="sectionid">BOOKMARK</h2>

answered Apr 25 '17 at 12:38

Dez

5,702
8
42
51

NickGames · Answer 2 · 2017-04-25T13:06:20.283

You need to create it like this:

<nav>
  <ul>
    <li><a href="#Home">Home</a></li>
    <li><a href="#About">About</a></li>
    <li><a href="#Clients">Clients</a></li>
    <li><a href="#Contact">Contact Us</a></li>
  </ul>
</nav>

And then on the related articles for example:

    <div class="article">
       <h1 class="title" id="Home">Home</h1>
       Sample text
    </div>

    <div class="article">
       <h1 class="title" id="About">About</h1>
       Sample text
    </div>

    <div class="article">
       <h1 class="title" id="Clients">Clients</h1>
       Sample text
    </div>

So what you put after the # in the "href" attribute, refers to the "id" attribute in another html element. (without #)

Nav li redirects to another section in another page

2 Answers2