3 fans

Click Shift and the middle mouse button anywhere on the page and a "bookmark" will be added to that spot. Click that spot again and the "bookmark" is removed. Use Shift+N and Shift+P to scroll to the next or previous mark.

Very useful for large pages, I can't count the number of times I wish I had a feature like this. I think it should be built in to the browser.

Useage

This is a User JavaScript.

Click Shift+middle-mouse button to set a mark.
This will store the id of the element clicked on, and add a class name to it.
The class is Page_Bookmarker_Mark, and a blue • mark is added.
You can change the style it uses, this is the CSS style code I use in the script...
.Page_Bookmarker_Mark:before { content: '\u2022'; color: blue; background-color: ivory; }
You could change the content character, I use the unicode value \u2022 for a bullet • ...
content: '\u2022';

Shift+middle-click the same place again and the mark is removed. Or shift+middle-click right on the dot to remove it.
You can change the mouse button in the script to either 0, 1 or 2. Also you can set modifier keys. See the JavaScript line in this script that says...
var PB_Prefs =
Be careful to not remove the comma at the end.
Another combo that works is Alt+right-button, if you change it to
button: 2,
shiftKey: false,
altKey: true,
and the context menu should not pop-up.
Verified (W3C), the left is 0, the middle is 1, and the right is 2. This is reversed for a left-handed mouse.

After you add a mark, you can scroll back to that mark by pressing Shift+P.
Pressing Shift+N will scroll to the next mark. The order loops, so you can loop through all your marks endlessly, in either direction.
You can change these keys as well, in the same place that I mentioned above.

I also set a style background color for the "Target", which you may not like, but you can change the CSS code...
*:target { background-color: ivory; }
or you can completely remove that line.

When you move between marks, you'll see something like #Page_Bookmark_1 added to the page's location. This is just the way it works, but it should also help you identify where you are at in the page.

By default, the above action replaces the current page in your History, so when you click the Back button you go to the last page visited and not the last Page_Bookmark.
If you change the PB_prefs replaceHistory to replaceHistory: false, then the old behavior is used, and clicking the Back button will go to the previous Page_Bookmark.

Notes

You can use Stylish and/or UserContent.css to change colors for different sites, or all sites if you don't want to edit this script. I posted the CSS code above.
With Stylish you have to use the !important keyword with any of these style items you want to change, like this...
.Page_Bookmarker_Mark:before { content: '>' !important; color: red !important; }
or to change the background color back to normal...
*:target { background-color: inherit !important; }
Stylish 0.5.5 works with SeaMonkey

The Page_Bookmark_# id is only added if the element doesn't already have an ID set, otherwise the actual id of the element is used. In other words, instead of #Page_Bookmark_1 in Location, you may see something else.

Each ID is only supposed to be used once, some pages may have multiple ids of the same name which is wrong. I don't know what will happen then and there's probably nothing I can do about it.

I may decide to change the keys or the way it looks. Suggestions are welcome.

It should have no effect on links or form text boxes.

This script uses a JavaScript 1.6 accessor method Array.indexOf()

Hey! This works pretty good when viewing a script source.