Implement HTML bookmarking in JavaScript

Question

I want to implement bookmark feature for my web app. Basically users should be able to bookmark a selection in a certain web page and later (in another browsing session) jump directly to that bookmark position.

In my first attempt, I save the value of pageYOffset when users choose to bookmark and when they jump to the bookmark I set the value of pageYOffset so that the browser scrolls to the right location. However, this approach only works if the user doesn't change font size or any other UI settings that will invalidate the old scroll position. I'm stuck right now.

Is there any other way to more reliably implement this feature?

Some constraints of the app:

• The HTML must not be modified
• The solution must work with Safari

Answer 1

Hmm... depending how your page is structured, you could get the closest id to their current position, and base the variable stored on that, rather than a specific location. You'll be closer even if things change!