1

I'd need an advice about how to create the code related to the sidebar contained into my homepage.

My homepage is composed of: header, left sidebar, main column (that is at the right of the sidebar) and footer.

What I need is a bit specific, indeed I tried to search for it, searched again and again through Google, through Stackoverflow and many other web sites but unfortunately I didn't get nothing that is right for me. I found several useful advices, several pratical examples and many starting points and I tried and tried again to mix each others the parts of these codes, but without getting what I really need about. All of this because I think my request is a bit specific and I'll try to explain it by hoping to be as clear as possible.

In my case I don't have just to fix a column, because I found meny examples about that as already told above. In my case I need to "synchronize" the left sidebar scrolling with the main column scrolling.

Something similar is present in Facebook, if you go into your profile page you can find something similar to what I need. By the way, I try to explain it here below by hoping to be as clear as possible:

  • at the time that I scroll the page DOWN I need that BOTH the left sidebar and the main column scroll down together, until the left sidebar will show the LAST visible element contained into it. At this point the scrolling should continue to scroll down ONLY the main column

  • vice versa, at the time that I scroll the page UP I need that BOTH the left sidebar and the main column scroll up together, until the left sidebar will show the FIRST visible element contained into it. At this point the scrolling should continue to scroll up ONLY the main column

Further note: the main column (NOT the left sidebar, but just the main column) is dynamic, in other words it shows the feeds dynamically, increasing its height instantly.

Hoping to having explained well the matter, I thank you all of you for your help!

Project-G
  • 11
  • 1
  • sticky sidebar may be the term you are looking for. Try some plugins for that. Or you have to add your custom code by listening to scroll event and calculating element position on each scroll. – sabithpocker Sep 09 '14 at 09:23
  • do you want something like this http://getbootstrap.com/getting-started/ where sidebar is scrolling as per content on left – Sauryabhatt Sep 09 '14 at 09:24

1 Answers1

0

Here is a jQuery plugin that seems to do what you want:

http://leafo.net/sticky-kit/

Zac
  • 984
  • 14
  • 25