homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / HTML
Forum Library, Charter, Moderators: incrediBILL

HTML Forum

<map> doesn't show color

Msg#: 4121454 posted 9:40 pm on Apr 24, 2010 (gmt 0)

Hi i am trying to make a 2 layer map. i have an image with that is a map. and on the map i wanted to add dots, second layer. i wanted to make 3 groups with every group a different colour. Every ID is a location and a group can be 20 people/locations. So i thought i make a class( class=end) and sommon that class in the css with a color. The problem now is that the color of that class doesn't show on the map. i have looked a lot on the internet and this forum, but i am now really stuck. can someone show me the way?

Thanx in advance.

[code HTML]<div id=imagemap>
<img height=728 src="map.jpg" width=728 useMap=#iDelta border=0>
<ap name=iDelta>
<!-- Area id's start with a -->
<area class="end" id=a7 onmouseover="D(this.id,1);" onMouseOut="D(this.id);" onClick="L(this.id,1);" shape=circle coords=263,233,25;>
<area id=a23 onMouseOver="D(this.id,1);" onMouseOut="D(this.id);" onClick="L(this.id,1);" shape="poly" coords="349,78,366,109,428,75,416,46">
<area id=t1 onmouseover="D(this.id,1);" onMouseOut="D(this.id);" onClick="L(this.id,1);" shape="poly" coords="348,140,372,180,433,138,419,127,377,120">[/code HTML]

[code CSS]img{
z-index: -1;
position: relative;
left: 0px;
visibility: visible;
width: 728Spx;
TOP: 0px;
height: 728px;
background-color: transparant


.end {
z-index: 4;
background-color: #f00;
position: absolute;
visibility: hidden;

}[/code CSS]



WebmasterWorld Senior Member tedster us a WebmasterWorld Top Contributor of All Time 10+ Year Member

Msg#: 4121454 posted 9:49 pm on Apr 25, 2010 (gmt 0)

Because of the <ap> element which is not standard HTML, this looks like Dreamweaver source code. If so, you may get better input from our WYSIWYG and Text Code Editors forum [webmasterworld.com].

I can't really pull it apart if it is intended to be regular HTML because there is no standard <map> element in what you've posted.


Msg#: 4121454 posted 7:29 am on Apr 26, 2010 (gmt 0)

i see what you mean. i see that i made a typo here. in my code there stands map. That is not the problem


WebmasterWorld Senior Member tedster us a WebmasterWorld Top Contributor of All Time 10+ Year Member

Msg#: 4121454 posted 7:47 am on Apr 26, 2010 (gmt 0)

I've never tried to use CSS and JavaScript with an image map, so I'm just probing a bit here. Does your JavaScript change the visibility from "hidden" to "visible"? Also there's a typo in "transparant" which should be "transparent".

And last, I'm not sure what the point of relative positioning for the <img> element is if the offest is only 0,0.


Msg#: 4121454 posted 8:09 am on Apr 26, 2010 (gmt 0)

i wanted to make a sort of dynamic way to show groups of people. and not photoshop it in a image every time


Msg#: 4121454 posted 8:28 am on Apr 26, 2010 (gmt 0)

function D(a,b) {
var label=a.substr(1);
var x=GetRef('d'+label);
var y=GetRef('i'+label);
if (x!=null)
if (b==1)
//y.focus = 'true';
y.style.background = '';


Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / HTML
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved