Printable View
Hi
I have a page which uses <meta http-equiv="refresh" content="240">
The problem im having is if i am half way downthe page when it refreshes, the refresh takes me back to the top of the page is it possible for the browser to keep the scrollbar position on refresh so that i do not loose my position on the page??
Thanks
Baz
Somehow you will need to keep track of the scroll position. Most likely a session cookie.
Set the value with onscroll and when the page loads check the value of the cookie. If it exists then scroll there with scrollTo().
If I were not busy at work, I would write it for you.
Eric
Take a look here, this might do you
http://www.huntingground.freeserve.c.../scrollpos.htm
<SCRIPT LANGUAGE="JavaScript">
<!--
function getCookie(name)
{
var start = document.cookie.indexOf( name + "=" );
var len = start + name.length + 1;
if ( ( !start ) && ( name != document.cookie.substring( 0, name.length ) ) ) {
return null;
}
if ( start == -1 ) return null;
var end = document.cookie.indexOf( ";", len );
if ( end == -1 ) end = document.cookie.length;
return unescape( document.cookie.substring( len, end ) );
}
function doload()
{
var scrollTop = getCookie ("scrollTop");
var scrollLeft = getCookie("scrollLeft");
if (!isNaN(scrollTop))
{
document.body.scrollTop = scrollTop;
document.documentElement.scrollTop = scrollTop;
}
if (!isNaN(scrollLeft))
{
document.body.scrollLeft = scrollLeft;
document.documentElement.scrollLeft = scrollLeft;
}
Delete_Cookie("scrollTop");
Delete_Cookie("scrollLeft");
setTimeout( "Refresh()", 120*1000 );
}
function Refresh()
{
document.cookie = 'scrollTop=' + f_scrollTop();
document.cookie = 'scrollLeft=' + f_scrollLeft();
document.location.reload(true);
}
//Setting the cookie for vertical position
function f_scrollTop() {
return f_filterResults (
window.pageYOffset ? window.pageYOffset : 0,
document.documentElement ? document.documentElement.scrollTop : 0,
document.body ? document.body.scrollTop : 0
);
}
function f_filterResults(n_win, n_docel, n_body) {
var n_result = n_win ? n_win : 0;
if (n_docel && (!n_result || (n_result > n_docel)))
n_result = n_docel;
return n_body && (!n_result || (n_result > n_body)) ? n_body : n_result;
}
//Setting the cookie for horizontal position
function f_scrollLeft() {
return f_filterResults (
window.pageXOffset ? window.pageXOffset : 0,
document.documentElement ? document.documentElement.scrollLeft : 0,
document.body ? document.body.scrollLeft : 0
);
}
function Delete_Cookie(name)
{
document.cookie = name + "=" + ";expires=Thu, 01-Jan-1970 00:00:01 GMT";
}
window.onload=doload;
//-->
</SCRIPT>
It is amazing that I could not find this anywhere on the web ... ty webdeveloper and Rajni!
I have been searching for this off and on for a couple of years and all I could find were wrong answers, code that didn't work and long pages of complicated code just to remember the scroll position. It can't possibly be that difficult.
Well, it isn't. It is super easy. I had to search a bunch of forums then whittle down each example until I finally got it to work with a minimum of fluff. You don't need a zillion lines of code, just two javascript snippets and a PHP cookie getter. You should be able to do it with pure javascript but I didn't need to so I mixed in some PHP.
This saves your current scroll position in a cookie whenever you scroll. Whenever the page loads it gets the scroll position from the cookie and loads the page at that scroll position. Voila! No more jumping to the top of the page when you reload. It works for links as well as the http-equiv refresh. I tried it with FireFox 15.0.1 and Chrome.
First, in the body tag (using PHP):
print "<body onScroll=\"document.cookie='ypos=' + window.pageYOffset\" onLoad='window.scrollTo(0,$ypos)'>";
And, above this,in your PHP code before anything that causes output to the browser:
$ypos = $_COOKIE["ypos"];
That's it. Works every time for me.
Fine if you have a server side language available, and you can be certain that nothing will overwrite your onscroll handler, and you'll never need to override the action when you link to your page using a #parameter or a querystring.Quote:
Originally Posted by rsduhamel
A little more work and here it is with no PHP. Pure javascript.
First you need a read-cookie function. Put this in the <head> section of your page:
<script language="JavaScript">
function readCookie(name){
return(document.cookie.match('(^|; )'+name+'=([^;]*)')||0)[2]
}
</script>
Next you modify the body tag as follows:
<body onScroll=\"document.cookie='ypos=' + window.pageYOffset\" onLoad=\"window.scrollTo(0,readCookie('ypos'))\">
Credit to the following page where I stole the read-cookie function:
http://stackoverflow.com/questions/5...-in-javascript
Quote:
Originally Posted by rsduhamel
I can't get this work for me. Below are two pages with the code but it doesn't work. What's the problem?
uweb.txstate.edu/~muk2/Untitled-1.html
uweb.txstate.edu/~muk2/Untitled-2.html
Oops!
Terrible mistake on my part. I cut and pasted this from my PHP code. I tried to remove all the extras but missed some backslashes. Here is the fixed code.
Quote:
Originally Posted by rsduhamel
My mistake. I forgot to remove some backslashes when I cut and pasted this from my PHP code. Remove the backslashes and it should work.
Wonderful beat ! I would like to apprentice at the same time as you amend your site, how could i subscribe for a wephorum website? The account helped me a appropriate deal. I had been a little bit familiar of this your broadcast provided shiny transparent concept best wishes
rsduhamel,
My experience was much the same as yours until I found your solution. I find it to work beautifully in all major browsers except, of course, IE. Would you kindly supply the code for an IE workaround. Thanks.
