Jump to content

Return to original place on a web page.


Steveinid
 Share

Recommended Posts

I have a web page where users can scroll down to see the content. Along the length of the page are links to another page. When the user clicks a link and gets to the next page they are presented a link to 'return to the previous page'. If they click that link it takes them back to the original page just fine but it returns them to the top of the page. I would like them to return to the same spot they were at when they exited the original page. When you use the 'back' button on the browser it does this. I don't know what the term is for it so I don't even know where to start looking for a way to do it. Any help would be appreciated.

 

Thanks

Steve

Link to comment
Share on other sites

Use JavaScript to make the link work as a back button instead of a normal link back to the page.  You can leave your link as it is now so users that have JS disabled will still go back, just not to the same position.

HTML:

<a href="previous.html" class="return-link">Return</a>

Script:

//Using jQuery
$('.return-link').click(function(e){
  e.preventDefault();
  history.back();
});

 

Link to comment
Share on other sites

Haven't used it in awhile but there is a use of the html <a> tag to do just what you want.  Create anchors in the page where you want to come back to and then use the same name value in your call back to the page.  Read up on it.

Link to comment
Share on other sites

<a href="#section2">Go to Section 2</a>
 

and

<h2 id="section2">Section 2</h2>

When you click on the anchor tag it will send you to the place where there is something with an id matching the href value.  You can create an anchor that directs you to another page also, just append the #xxx to your url as in:

<a href="mywebpage.com#section2">Go to new page</a>

Link to comment
Share on other sites

Actually, it's the name attribute to define an area of the page scroll-wise.

<a name="middle-of-page">

Then you can have your link with the name in it

<a href="#middle-of-page">Click to go to middle of page</a>

For external usage, just put the page url.

<a href="page2.html#middle-of-page">Click to go to middle of Page 2</a>

 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.