Return to top of the page when clicking back

Question

I have the following question/problem:

On this page http://www.projectyou.gr/gp/?page_id=5 there are 3 tabs
[It's all in Greek but I hope you will understand]
Each tab contains links to articles.
When you click on an article and then press the back button on the browser it comes back to the selected tab AND scrolls to the article you clicked.
As much as I like this behavior it is not what I want in this case.
I would like the user, when returning to the page, always go to the top.

What is the best way to achieve this.
Does it have to do with the fact that I'm using jQuery tabs and the code that I have for returning to the previously selected tab causes to jump to previously clicked anchor??

Any help would be very much appreciated.
Thanks

what top are you saying?... when I click a tab, my back button is not even click-able... — Reigel Gallarde, Aug 04 '10 at 10:11
Click on an article that is down to the bottom of the page. This will get you to another page. If you click back then you return to the bottom of the page. I would like to prevent that and always return to top of page. Hope that helps. Thanks for the quick respond :_) — ion, Aug 04 '10 at 10:13
now, when I press back button, it brings me to tab Εκπαίδευση. Am I with you at this? even if I was not on that tab before I clicked a link... — Reigel Gallarde, Aug 04 '10 at 10:16
yes this is correct ... when clicking the back button it goes to the first tab. That is another thing am working on. Any suggestions would be great. It is a bit confusing working with jQuery tabs when it comes to history and anchor tags. — ion, Aug 04 '10 at 10:33

score 2 · Answer 1 · edited May 23 '17 at 12:30

2

how about adding something such as this to your document ready handler (I realize you may already have one, so just appending the scrollTo might do it):

$(document).ready(function() {
  window.scrollTo(0, 0);
});

like in this SO question

edited May 23 '17 at 12:30

Community

1
1

answered Aug 04 '10 at 10:21

Yoni H

453
2
7

This works, thanks a lot. Just did it. However it seems like it goes down and then up. There is a small latency ... it would be great if we could find a solution to prevent that behavior. Thanks a lot anyway – ion Aug 04 '10 at 10:31
well... instead of scrolling at the end of the ready handler, you could try and sneak it in a "normal" – Yoni H Aug 04 '10 at 10:33

score 0 · Answer 2 · answered Aug 04 '10 at 12:15

You could also use

$("html:not(:animated),body:not(:animated)").animate({ scrollTop: 0}, 500 );

which scrolls it in an animated way, The 500 is the speed in milliseconds

the 0 is how from from the top of the page,

if you wanted to scroll to the top of an element you could replace it with

var offset = $('element').offset();
var top = offset.top;
$("html:not(:animated),body:not(:animated)").animate({ scrollTop: top}, 500 )

;

Return to top of the page when clicking back

2 Answers2