html static page position after refresh

StackOverflow https://stackoverflow.com/questions/409372

  •  03-07-2019
  •  | 
  •  

Question

I have a page where I would like it to remain static after refresh and does not default back to the top page again as it will disrupt the position I was viewing it last. Hence I have all the time to scroll down again to find the area I was viewing last. Is there a way of eliminating the burden of scrolling down again?

Was it helpful?

Solution

Here's an example of retaining scroll position using PHP.

Here's an example for ASP.NET.

If those don't suffice, doing a google search for "retaining scroll position" will provide many more examples.

OTHER TIPS

Sorry - I took down the blog referenced above (noticed in redirect stats), but the post is still available from archive.org: http://web.archive.org/web/20050508195342/patrickfoley.com/2005/01/21/scroll-saver/

Here's the complete PHP example from that page:

<HTML>
<HEAD>
<TITLE>Test</TITLE>
<script>
  function SaveScrollXY() {
    document.Form1.ScrollX.value = document.body.scrollLeft;
    document.Form1.ScrollY.value = document.body.scrollTop;
  }
  function ResetScrollPosition() {
    var hidx, hidy;
    hidx = document.Form1.ScrollX;
    hidy = document.Form1.ScrollY;
    if (typeof hidx != 'undefined' && typeof hidy != 'undefined') {
      window.scrollTo(hidx.value, hidy.value);
    }
  }
</script>
</HEAD>
<BODY onload="ResetScrollPosition()">
  <form name="Form1" id="Form1" method="post"
    onsubmit="SaveScrollXY()" action="index.php">
    <input name="ScrollX" id="ScrollX" type="hidden"
      value="<?php echo $_REQUEST['ScrollX'] ?>" />
    <input name="ScrollY" id="ScrollY" type="hidden"
      value="<?php echo $_REQUEST['ScrollY'] ?>" />
    <p>This is just a paragraph to make a very long page.</p>
    …
    <P>This is just a paragraph to make a very long page.</P>
    <P>
      <input name="TextBox1" type="text"
        value="<?php $v = $_REQUEST['TextBox1']; echo $v ? $v + 1 : 1 ?>"
        readonly="readonly" id="TextBox1" /></P>
    <P>
      <input type="submit" name="Button1" value="Post Form"
        id="Button1" /></P>
  </form>
</BODY>
</HTML>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top