Hi, I am trying to create a menu like the one on http://www.momentumww.com/
When you scroll to section 'About', the menu 'About' button will be highlighted in white instead of black.
Anyone has any idea how to do this?

Recommended Answers

All 2 Replies

There are a variety ways to do this such as pure CSS, or JavaScript. Just look at the source code when you are on the page (right click-view source) in your browser, or use your browser's dev tools.

An easy way to do this is with the pseudo class "hover". For example...in your CSS if you want to change the background color of an element with an id of "menu" it could look like this..

#menu:hover {background-color:red}

Hi. In the example you give there is a combination of the javascript scroll event to test against the Id of a section compared to the scrollTop. this then actually does a "redirect". I put this in speach marks because the seems to stay the same but is using server side tech (and most likely a .htaccess file) to tell it which bookmark to go to. So it's actually probably the serverside that is changing the link colour as well.

if you're not bothered about the url changing you could do it with pure javascript. I would use a library (e.g. jquery) to make it easier for measuring the scroll top, though.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.