Saving scroll position

Hi,

I was wondering if someone can give me a code example for saving the scroll position of the browser with jquery? In my theme the user needs to scroll a little bit down so see the comments. When the user clicks to the next picture (or is doing a browser refresh) the browser should restore the last scroll position. I found out that it is possible to do it with jquery that my theme is using anyway. But I don't know how do it. Can someone give me an code example?

Thanks

Norbert

Comments

  • acrylian Administrator, Developer
    Saving any real scroll position would require cookies per user. What you probably wish is to scroll to a specific element. You would just have to add an id to an element. Say the image gets `id="image"`. Then add to your links `#image` and it will scroll to that. No jQuery needed at all.
  • acrylian Administrator, Developer
    Addition: To add you can of course scroll directly using the jQuery Plugin scrollto:
    http://demos.flesler.com/jquery/scrollTo/
    Might be easier than editing the links on the theme (depending on the theme).
  • Acrylian, thanks for your help. I am not an expert in php and javascript. What do I need to put into my image.php? I have added the following code into my header of the image.php file:

    '<script>

    // When the document is loaded... NM
    $(document).ready(function()
    {
    // Scroll the to the content area
    $.scrollTo( '#content', 800, {easing:'elasout'} );
    });
    </script>'

    Do I need to do more? Do I need to add somehow the scrollto-script function from jquery to my theme or is it allready in zenphoto integrated?

    Thanks again for your help

    Norbert
  • acrylian Administrator, Developer
    You have to add the scrollTo jQuery script to your theme, too. jQuery itself does not have a "scrollTo" function. And you need to have an element with `id="content"`.
  • Thanks for your hints. With your help I figured it out.I added the follwing code to my header.php and now it is working:

    `
    <?php if (($_zp_gallery_page) == 'image.php') { ?>
    /js/jquery-scrollto.js">
    $(document).ready(function() {$('#content').ScrollTo();});"; <?php }
    ?>
    `
Sign In or Register to comment.