I'd like that a specific link goes to a certain header on another page. I know how to do it on the current page.
5 Answers
Take a look at anchor tags. You can create an anchor with
<div id="anchor-name">Heading Text</div>
and refer to it later with
<a href="http://server/page.html#anchor-name">Link text</a>
-
1The use of
<a name ...>
is declared as obsolete in HTML5 CR, and it really reflects the shortcomings of early HTML versions. Dec 13, 2013 at 14:09 -
@JukkaK.Korpela I wasn't aware of that. Has just using IDs of elements (e.g.
div
s) replaced it? Or is there some other mechanism?– kfbDec 13, 2013 at 14:20 -
3Using
id
attributes is the recommended way (and has been possible for a long time, all relevant browsers support it). Dec 13, 2013 at 14:28 -
1@JukkaK.Korpela Thanks for the information! I've updated my answer for anyone who subsequently finds it.– kfbDec 13, 2013 at 14:31
-
1Should this work on PHP too? I am not getting result on <a href="page.php#anchor-name">Link text</a> Oct 19, 2015 at 19:39
You simply combine the ideas of a link to another page, as with href=foo.html
, and a link to an element on the same page, as with href=#bar
, so that the fragment like #bar
is written immediately after the URL that refers to another page:
<a href="foo.html#bar">Some nice link text</a>
The target is specified the same was as when linking inside one page, e.g.
<div id="bar">
<h2>Some heading</h2>
Some content
</div>
or (if you really want to link specifically to a heading only)
<h2 id="bar">Some heading</h2>
You can add hash info in next page url to move browser at specific position(any html element), after page is loaded.
This is can done in this way:
add hash in the url of next_page : example.com#hashkey
$( document ).ready(function() {
##get hash code at next page
var hashcode = window.location.hash;
## move page to any specific position of next page(let that is div with id "hashcode")
$('html,body').animate({scrollTop: $('div#'+hascode).offset().top},'slow');
});
-
How do you call this function, and where do you put the code? Sorry, kinda new to this.– NojiNov 4, 2019 at 8:44
Create an anchor:
<a name="anchor" id="anchor"></a>
then link to it:
<a href="http://server/page.html#anchor">Link text</a>
<a href="./container.html">
<div>anything
<h1>hello stcakoverflow<h1>
<div>
</a>
now doing thos this all div are clickcable
-
-
If you have a new question, please ask it by clicking the Ask Question button. Include a link to this question if it helps provide context. - From Review– MassimoNov 2, 2022 at 21:15
<a href='myOtherPage.html#myDivId'>myLink</a>
<div id="foo"></div>
and<a href="bar.html#foo">Go to Foo</a>