Div, Background Image, and Image Map

Posted by Coolmoondog on Stack Overflow See other posts from Stack Overflow or by Coolmoondog
Published on 2009-11-13T12:21:27Z Indexed on 2010/05/16 17:10 UTC
Read the original article Hit count: 285

Filed under:

div

|

background-image

|

imagemap

On a web page I'm creating, I have a div with a background image. I overlay some text over the image that I'll be changing frequently, so that's why I'm using a background image and real text instead of an img tag that contains the text.

The background image contains some click-able areas, so I need an image map.

I think the best way to do this is to have another overlay div with a transparent image, and have an image map for the transparent image that corresponds to the background area click-able areas.

Am I on the right track, or is there a better way?

© Stack Overflow or respective owner

Related posts about div

add a div.class in a child, only when the parent does not have other div.class

as seen on Stack Overflow - Search for 'Stack Overflow'
i have a html code like this: <div class="someclass"> <div class="childclass"></div> <div class="checkclass"></div> </div> <div class="someclass"> <div class="childclass"></div> </div> <div class="someclass"> <div… >>> More
#div:normal #div:hover #div:SELECTED?

as seen on Stack Overflow - Search for 'Stack Overflow'
Hey guys, On the "services" and "company" pages I have a right sidebar list. This is being included with PHP. So far I have a CSS class for normal and a CSS class for when you hover each item in the list. I want to have a new class for when each list item is selected. So for example in services,… >>> More
DIV Overlaying DIV, links in backmost DIV non-accessible

as seen on Stack Overflow - Search for 'Stack Overflow'
I have a photoshop image that is 500x600 that I am using as a background image for the first div. The second div sits over top of the first div and is populated with images. The z-index of the first div is set to 100. The effect is the photoshop image sits over top of all of the smaller images. The… >>> More
Two DIV layers: resize top DIV based on dynamic height of bottom DIV

as seen on Stack Overflow - Search for 'Stack Overflow'
I have two DIV layers, one above the other. In the top DIV, there is an image, and in the bottom DIV, there is a block of text. The amount of text in the bottom DIV will change, thus increasing and decreasing the required height. I need to dynamically decrease the height of the image in the top DIV… >>> More
Why won't my DIV height grow? Is it because I am using floats?

as seen on Stack Overflow - Search for 'Stack Overflow'
Please help! I am trying to create some div sections and some of these div sections have some other divs that are floated. All of which I have cleared. But the sections are not growing to accomodate the content inside of them. The following is my HTML - <div class="data"> <div class="name">Data</div> … >>> More

Related posts about background-image

Twitter Bootstrap styling conflicts with plug-ins like jqGrid and other third part libraries

as seen on Geeks with Blogs - Search for 'Geeks with Blogs'
Issues:The concern is that the Twitter Bootstrap framework is that some of their css selectors are simply too generic and have incompatibility issues and conflicts with most third party plug-ins and css libraries, like jQuery-UI and jqGrid.My most pressing concern is only with the generic selector… >>> More
CSS: background image does not fill when scrolling

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi, working on a very small site which loads in one go, so there is a div which holds all the background images, and on top of that (i.e. higher z-index) there is a content div which holds everything. I can switch backgrounds easily based on what content is selected. Unfortunately, I noticed if… >>> More
Drupal Background Image as Block or Node

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi There. I am having trouble wrapping my head around how to make editable background images in my custom Drupal 6 theme. My client wants to have a different background image for each main section (which use multiple content types: page, blog, image gallery)... I am wondering, is there a way to… >>> More
How can I fix the website's splash page to work in IE8 and below?

as seen on Stack Overflow - Search for 'Stack Overflow'
I have been trying to figure out for the longest time how I can get the splash page on this website to work correctly in IE8 and below? Right now, it works on all the other browsers (Firefox, Chrome, Safari). Here is the website: http://gds.parkland.edu/student/fall10/gds220/ashipley/p2/final_revised/index… >>> More
Interface builder UIButton custom background image not working on simulator/device

as seen on Stack Overflow - Search for 'Stack Overflow'
I'm trying to do something really simple. I have an image for a button and I'm trying to set it on a custom button in interface builder. I set the background image accordingly (no case sensitivity problem here). In interface builder it shows up, but in the simulator or on the device it doesn't appear… >>> More