Grow your CSS skills. Land your dream job.

Image map with css?

  • # June 1, 2008 at 1:21 pm

    Is it possible to make something like image map with css? :roll: :?

    If yes, then how?

    P.S I’m using WordPress CMS

    # June 1, 2008 at 3:53 pm

    yep it is.

    There is a good example here>>

    # June 1, 2008 at 4:02 pm

    I think the theory is to place the image inside of a DIV with the same dimensions. Apply relative positioning to the DIV, then you can absolutely position things inside the DIV like you would an image map.

    Personally, I don’t mind just using regular image maps. It’s one of things I still pop open Dreamweaver for.

    Here is a little example I did for a client that uses a regular image map and javascript tooltips:
    http://beaconathletics.com/shopthisfield.php

    -Chris

    # June 2, 2008 at 11:02 am

    "Personally, I don’t mind just using regular image maps. It’s one of things I still pop open Dreamweaver for."

    But, Dreamweaver makes a Html image map, i can’t use this, becouse i’m working with WordPress CMS :(. I need css image map.

    # June 2, 2008 at 6:02 pm

    Use absolute positioning to put a div over the image which can be clicked using javascript.

    # June 2, 2008 at 9:57 pm

    What does WordPress have to do with it? Is it stripping away your image map code? I’m sure there is a way around that… Even just switching into HTML view while writing posts/pages and dropping the map code in there should probably work.

    # June 13, 2008 at 10:28 pm

    If you want some inspiration, this is a good place to go for image maps.

    http://www.cssplay.co.uk/menu/ left hand column at the bottom.

    http://www.cssplay.co.uk/menu/old_master

    Stu Nicholls is up to all sorts of css madness!

    Check it out. :D

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

You must be logged in to reply to this topic.

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