Grow your CSS skills. Land your dream job.

A "Current" Styling On Nav Buttons For request.html

  • # January 10, 2009 at 3:04 pm

    I have a main panel in which external html documents are loaded in via ajax as you click on the the navigation buttons. How would I go about styling the nav links to remain in a particular state when that links corresponding document is displayed in the loader? I already have the sprites built with the three states. I just don’t know how to go about styling the "current" state.

    Here’s a link to the site in question http://www.dratpackproductions.com

    Thanks in advance for any help

    # January 10, 2009 at 7:03 pm

    I’m sure you are working with a "click" event to load the new data. As a part of that same event, apply a class (like "current") to the element being clicked. Then use that class in the CSS to style the "on" state. Before you apply the "current" state, it’s probably a good idea to also clear that state from all other elements first.

    # January 10, 2009 at 11:29 pm

    I had the exact same question. I’ve been trying to do it in jquery but but I just cant get it to work.
    Would it possible if anyone could post a sample of what jquery would look like if done properly. Or any pointers/resources that would be helpful to look at.

    I would post what I have doe so far, but it’s a bit embarrassing lol, as I’m pretty newb ;)

    Thanks

    # January 14, 2009 at 2:14 am
    "ncmason" wrote:
    Are you trying to do what this site does on their homepage?

    Yeah that exactly what im trying to do accept for a navigation coded with a <ul>.

    Do you know how to do this? I trying doing it with jquery but it was to confusing :S. An example of the code would really help.

    # January 18, 2009 at 9:22 pm

    I totally missed this scrn cast in the list.

    http://css-tricks.com/video-screencasts … e-body-id/

    just incase anybody was having the same problem.

    Thanks for the screen cast Chris. I wish I had seen it earlier.

    Nathan

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".