Grow your CSS skills. Land your dream job.

Help with sliding door navs

  • # August 28, 2009 at 12:55 am

    i have managed to get my tabbed, horizontal navs looking like i want using what i guess is some version of the sliding door technique that i somehow managed to cobble together after many hours of sorting thru various tutorials, and a lot of trial and error. The only problem is, i want to have a "current page" state for each tab. i.e. (as you can see if you follow the link) – the home page tab is the color of the main content area, and doesn’t have rollover effects. I would like to achieve that for each page of the site: about, menu, etc… This site uses the exact same look as well, actually. i’ve tried for hours and i can’t figure out how to achieve this. Any help would be really appreciated.
    Link: http://www.brandmatika.com/clients/dafausto/

    Best Regards,
    jamie

    # August 28, 2009 at 5:05 am

    Firstly, I spose you know your tabs don’t lead anywhere so they are not going to have an on state.
    Secondly, Could you not do the other tabs the same way you did your home tab.
    Lastely, Here is a tutorial from this site which goes through creating on states and roll over stated,
    http://css-tricks.com/video-screencasts/13-converting-a-photoshop-mockup-part-two-episode-two/

    # August 28, 2009 at 10:30 am
    "AlCapone" wrote:
    Firstly, I spose you know your tabs don’t lead anywhere so they are not going to have an on state.
    Secondly, Could you not do the other tabs the same way you did your home tab.
    Lastely, Here is a tutorial from this site which goes through creating on states and roll over stated,
    http://css-tricks.com/video-screencasts/13-converting-a-photoshop-mockup-part-two-episode-two/

    Obviously i konw the navs don’t lead anywhere yet, i want to get the homepage working right before i build the other pages. The home tab is in a separate list with it’s own id, so i could treat it differently. i can’t get it to work in the main nav list. i was asking for help with the sliding door technique i was attempting to use here, the video does not cover that. Thank you for replying though.

    I am open to suggestions if there is a better way to construct this, i just really need to get this done today.

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

You must be logged in to reply to this topic.

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