Question

How to implement a sidebar, which is positioned somewhere at the page and when user scrolls page down, it changes positioning and scrolls with the main content, always remaining visible?

Here is an example (scroll down, please)

---

Oh dear! I just had to specify the following style (which wasn’t too obvious for me):

.affix {
    position: fixed;
}

And, of course, to add jQuery:

$('.leftnav').affix();

Huge thanks to everyone, who tried to help me!

Answer 1

Checkout the source for the page you’ve linked to. The solution involves changing to position fixed upon user scroll down just enough to top edge of menu reach top edge of the screen (that’s done by listening to scroll events). Initialy (when page is served) the menu doesn’t have position fixed.

Edit:
Or better yet… here’s script that will do just that http://twitter.github.com/bootstrap/javascript.html#affix 😉