Positions on divs to affect css on menu links

jquery , css , html Denpasar, Indonesia
  • 9 years ago

    I have a one-page website with a menu that is linked internally to divs on the page. I want to make the menu links to get the css :active state whenever the div with the corresponding id reaches a certain position set from the top of the page (preferably with some margin like between 30-60px from the top). Since I'm quite new to jQuery I don't really know how to go about this. I can imagine I have to start with getting the position of any div with an id and if that id has an internal link with a corresponding name that link should change css class. If another div with an id that corresponds to another internal link reaches that position, the class of the fomer active link has to go back to it's original state so that only one menu item is active at any point. I figure this way the first link will be active when the page loads as its target div will be at the top of the page and that one menu item will be active at any time since it will stay active until another link gets active.

    I hope I'm able to explain what I wish to achieve... With the little knowledge I have in jQuery I think this should be doable (and quite a cool effect) but I can't figure out how to make it happen.

    Would very much appreciate some suggestions! :)

Post a reply

No one has replied yet! Why not be the first?

Sign in or Join us (it's free).

Contribute

Why not write for us? Or you could submit an event or a user group in your area. Alternatively just tell us what you think!

Our tools

We've got automatic conversion tools to convert C# to VB.NET, VB.NET to C#. Also you can compress javascript and compress css and generate sql connection strings.

“Engineers are all basically high-functioning autistics who have no idea how normal people do stuff.” - Cory Doctorow