Support » Fixing WordPress » How do you make a nav bar within the header image?

  • pezastic

    (@pezastic)


    I’ve seen it on some sites, where the nav link buttons are within the header image. How is that done?

Viewing 10 replies - 1 through 10 (of 10 total)
  • pezastic

    (@pezastic)

    Mark (podz)

    (@podz)

    Support Maven

    Can you link to such a site ?
    We can then check the code.

    cdkrall

    (@cdkrall)

    dappleyard

    (@dappleyard)

    I’m currently working on a tutorial for such a system, and I will be posting it on my blog sometime tomorrow. I have just completed a tutorial showing how to add a stylesheet switcher to your site.

    pezastic

    (@pezastic)

    I think what I’m probably looking for is a good javascript image map tutorial. The nav bar you referenced is not actually part of a linked header image. Ideally, it would be nice to do this with CSS, but I don’t think it is possible.

    dappleyard

    (@dappleyard)

    I see. I believe one way to do this in CSS would be to place clickable transparent div areas over the header image, however I imagine this would be a fairly poor solution.

    I found this tutorial for an image map in general – http://www.htmlgoodies.com/tutors/cs_imap.html – it might be of some use

    Mark (podz)

    (@podz)

    Support Maven

    A half-decent graphics program should be able to sort out clickable images.

    dappleyard

    (@dappleyard)

    I agree, and I don’t know what editor you are using to create your HTML pages, but Dreamweaver has excellent built in image map capabilities.

    puppy18

    (@puppy18)

    Jeffrey zeldman site gives you roughly the idea on how to combine image map and image rollover for navigation bar. You can check his site or mine out to sort of study the css codes on how to do this. As far as i can tell, its neat and no javascript required.

    pezastic

    (@pezastic)

    I don’t see where you have them combined on your site. I’ll check out the Zeldman site
    after work. (For some strange reason, it is blocked here at work.)

    UPDATE: I couldn’t find anything on the aforementioned site, either. However, it did make reference to an ALA article, “Night of the Image Map” that comes close to doing what I want with CSS.

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘How do you make a nav bar within the header image?’ is closed to new replies.