jQuery changing css on navigation when div # scrolls into view
- by Jonny Wood
I'm looking to recreate the effect used on this site: http://www.brizk.com/
The site uses one large page that scrolls down. As you scroll down and pass different sections the menu navigation on the left changes css class to "current" as the corresponding div comes into view.
I presume this can be done with jQuery using $(window).height();
I'm fairly new to jQuery and what I want to write is something like this (in laymans terms):
Get height of browser window
– if div#content1 is 100px from top and/or 200px from bottom change menu a#link1 to '.current'
– else remove .current from all menu a links
... and repeat for 4 different content divs.
Can anyone point me in the right direction..?
Thanks.