User:Keepcalm444/floatingnav

This is a JS/CSS combo that adds a floating header and sidebar. (Note that for all the features to work correctly it requires the Vector skin to be used.)

When the sidebar is larger than the window, it remains at the top, otherwise it follows the page.

If you expand the sidebar so that it is larger than the window, it will go to the top - in a pretty, animated manner.

You can also hide the sidebar by clicking the "«" and show it again by clicking "»". The header can also be hidden/shown by clicking on either one of the "˄ ˅" located at the top left-hand corner of the article.

Using it

Right now, it only works on English Wikipedia.

To use it on English Wikipedia, add this to Special:MyPage/vector.js.

importScript("User:Keepcalm444/floatingnav.js");

If you don't like all the animations

You can disable the smaller animations by adding the following code to Special:MyPage/vector.js before the above code:

window.DISABLE_ANIMATION = true;

Code

The code can be found at User:Keepcalm444/floatingnav.js and User:Keepcalm444/floatingnav.css. It's messy. The CSS is mostly just to make it look nice and keep the header at the top, while the javascript mostly deals with the sidebar animation and stuff.

Bugs

What bugs?

The header show/hide mechanism shows a down arrow when you cannot use it. Clicking the up arrow and the down arrow will fix it.