Navigating to a specific div from an external link
Question
I'm trying to make a certain link that redirects the user to a certain div within the page. (eg https://blabla.github.io/my-website )
My code is pretty simple and it works locally:
<div id='projects'>
<h1 className='pt-32 text-5xl pb-10 text-center font-gloria italic'>
Some of my projects <span className='text-xs '>(so far...)</span>
</h1>
</div>
when I try to link to: https://blabla.github.io/my-website#projects It does redirects me the page yet not to the specific div I need.
would appreciate the help!
1 answers
solution1
0 2022-12-15 20:29:28
To navigate to a specific div on a page from an external link, you can use a technique called "fragment linking." This involves adding a # followed by the id of the div you want to link to, at the end of the URL. For example, if the URL of the page is https://www.example.com and the id of the div you want to link to is my-div, the link would be https://www.example.com#my-div . When someone clicks on this link, they will be taken to the page and automatically scrolled to the div with the id of my-div.
<html> <body> <div id="my-div"> This is the div I want to link to. </div> </body> </html>
To create a link to this div, you could use the following HTML:
<a href="https://www.example.com#my-div">Click here to go to the div on the page</a>
When someone clicks on this link, they will be taken to the page and automatically scrolled to the div with the id of my-div.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.