Very confused : Displaying a div with area onclick

AnunnakiSpirit posted this at 19:06 — 18th January 2006.

They have: 1 posts

Joined: Jan 2006

Hello, I have a bit of a problem trying to work something out. I have an image with a map on it, what i'm trying to achieve is a div appears exactly where someone clicks the map.

<area name="whatever" onClick="javascript:document.all.whatever.class.display='block'">

<div id="whatever" style="display:none;">
<h2>HI</h2>
</div>

I'm using something similar to the above, but nothing happens on the click.

mikehannon posted this at 23:56 — 18th January 2006.

They have: 64 posts

Joined: Oct 2005

I guess you would be using an image map?
This should work with a little modification... for example you may have to use absolute positioning to put the where you want it to appear.

I'm sure there are other ways to do it though...

CptAwesome posted this at 06:50 — 19th January 2006.

He has: 370 posts

Joined: Dec 2004

document.all is only used by IE, you should use document.getElementById(id);

The best idea is to make a JS function like:

function showdiv(id){
	obj = document.getElementById(id);
	if(obj.style.display == 'block'){
		obj.style.display = 'none';
	}else{
		obj.style.display = 'block';
		}
	}

onclick doesn't need 'javascript:', so your HTML would be

<area onClick="showdiv('whatever1');">

<div id="whatever1">
Hello World
</div>

mikehannon posted this at 17:01 — 19th January 2006.

They have: 64 posts

Joined: Oct 2005

I thought it would only work in internet explorer as well but while i was playing with the code i found it works in IE Opera and Firefox ( the latest versions anyway ) :S .
Here's a test page

http://www.anthonychristian.co.uk/test.html

I substituted the for a table so that the clickable region is visible...