469,356 Members | 2,003 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,356 developers. It's quick & easy.

Background Image on Image Map

3
I've been trying and failing to create an image map that contains a tiled background image underneath the main image.

My image map is 600px in height. I want the main image (img_bottom.jpg) to only cover the bottom 100px of the map (and the background to fill the rest of the space).

The height of the main image will change, which is why I want to leave the empty space as a tiled background image.

Expand|Select|Wrap|Line Numbers
  1. #my_map {
  2.     display: block;
  3.     height: 600px;
  4.     width: 1000px;
  5.     margin: 0px auto;
  6.     margin-bottom: 10px;
  7.     position: relative; 
  8.     top: 0px; 
  9.     left: 0px; 
  10.     border: 2px solid #51595C;
  11.     border-top: none;
  12.     background: url(../images/ob09_5.jpg) repeat top left;
  13. }
  14.  
  15. <map name="my_map" id="my_map"></map>
  16.  
  17. <img name="imap" id="imap" src="./images/img_bottom.jpg" ismap usemap="#my_map" />
  18.  
  19.  
Any suggestions on how to achieve this on all browsers?
Oct 31 '06 #1
0 2849

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

4 posts views Thread by erik | last post: by
27 posts views Thread by Kevin Yu | last post: by
13 posts views Thread by Giggle Girl | last post: by
3 posts views Thread by Viken Karaguesian | last post: by
2 posts views Thread by Patrick | last post: by
16 posts views Thread by stevedude | last post: by
reply views Thread by suresh191 | last post: by
1 post views Thread by Marylou17 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.