Menu
I have a link on one page that needs to go to a different page, but load to a specific section on that other page.
I have done this before with bootstrap but they take all the 'coding' out of it, so I need to know how to do from scratch. Here is the markup I have based on this link (not the best resource, I know): http://www.w3schools.com/html/html_links.asp
**Page One** <a href="/academics/page.html#timeline> Click here </a> **Page I am linking to** <div id="timeline" name="timeline"> ... </div> Can I do this with just HTML, or do I need some JavaScript? If I need to do it via JS, it needs to be on the target page, right?
511
You can use anchor ( <a> ) links in HTML to link to a different page or a different website. But how can you link to a specific part of a web page? The answer is jump links. Jump links are links that won't just load the page, but they will “jump” down to a specific part of a web page.
One can use the anchor tag to redirect to a particular section on the same page. You need to add ” id attribute” to the section you want to show and use the same id in href attribute with “#” in the anchor tag.
I believe the example you've posted is using HTML5, which allows you to jump to any DOM element with the matching ID attribute. To support older browsers, you'll need to change:
<div id="timeline" name="timeline" ...> To the old format:
<a name="timeline" /> You'll then be able to navigate to /academics/page.html#timeline and jump right to that section.
Also, check out this similar question.
166
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
