WordPress.org

Forums

How do you make a nav bar within the header image? (11 posts)

  1. pezastic
    Member
    Posted 10 years ago #

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

  2. pezastic
    Member
    Posted 10 years ago #


  3. Mark (podz)
    Support Maven
    Posted 10 years ago #

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

  4. cdkrall
    Member
    Posted 10 years ago #

  5. dappleyard
    Member
    Posted 10 years ago #

    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.

  6. pezastic
    Member
    Posted 10 years ago #

    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.

  7. dappleyard
    Member
    Posted 10 years ago #

    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

  8. Mark (podz)
    Support Maven
    Posted 10 years ago #

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

  9. dappleyard
    Member
    Posted 10 years ago #

    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.

  10. puppy18
    Member
    Posted 10 years ago #

    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.

  11. pezastic
    Member
    Posted 10 years ago #

    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.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.