Need more interactivity in nav menu

Posted on 2012-09-13
Last Modified: 2012-09-20
I have a menu that I need more interactivity coded in.  Specifically, when you are on a page, I want that corresponding menu word (i.e. news) to be in white, and underlined.  How do I code it?  I'm attaching the style sheet and a sample page.

Question by:Revolution9
    LVL 70

    Expert Comment

    by:Jason C. Levine
    You need to use either javascript or server-side scripting code like PHP to determine what page the user is on or which menu item was last clicked and apply a different CSS class to the appropriate menu item.  

    Here's an idea or two to get you started:

    Author Comment

    I was afraid you'd say that.
    LVL 52

    Expert Comment

    by:Scott Fell, EE MVE
    Create a class for your nav for current page.

    header nav ul li.currentpage a {

    Then in your li add the class currentpage

     <li class="currentpage"><a href="index.html">home</a></li>

    Play around with the actual color you want and also a hover feature too
    LVL 70

    Accepted Solution

    I was afraid you'd say that.

    Sorry.  HTML is a stateless doesn't know anything about anything.  Scripting is needed for almost all dynamic functionality.

    Featured Post

    IT, Stop Being Called Into Every Meeting

    Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

    Join & Write a Comment

    So you have coded your own WordPress plugin and now you want to allow users to upload images to a folder in the plugin folder rather than the default media location? Follow along and this article will show you how to do just that!
    Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
    The purpose of this video is to demonstrate how to integrate Mailchimp with Facebook. This will be demonstrated using a Windows 8 PC. Mailchimp and Facebook will be used. Log into your Mailchimp account. : Click on your name. Go to Account Setti…
    The purpose of this video is to demonstrate how to prevent comment spam on a WordPress Website. This will be demonstrated using a Windows 8 PC. Plugin Akismet will be used. Go to your WordPress login page. This will look like the following: myw…

    728 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    18 Experts available now in Live!

    Get 1:1 Help Now