Loading an imagemap in the same div

Hi,

I have a menu which when clicked loads an image in a div. Now this image has an imagemap on it, how do i get the imagemapped content to load back on the same parent div ? here’s a small snippet to let you know how this is being intergrated….

[code]
<ul id=”countrytabs” class=”shadetabs”>
<li><a href=”#” rel=”country1″ class=”selected”>Development</a></li>
<li><a href=”#” rel=”country2″>Bug Fixes</a></li>
<li><a href=”#” rel=”country3″>Agile</a></li>
<li><a href=”#” rel=”country4″>Functional Testing</a></li>
<li><a href=”#” rel=”country5″>Automation Testing</a></li>
<li><a href=”#” rel=”country6″>Performance Engineering</a></li>
</ul>
[/code]

This above code has the list that holds the different menus. Each of these options loads an image with a imagemaps. The code below holds the divs in which the image (with the image maps) are loaded

[code]
<div style=”border:1px solid gray; width:600px; height:auto; margin: 0px 0 10px 0; padding: 0px;”>
<div id=”country1″ class=”tabcontent”>
<!– ImageReady Slices (dev_flow.jpg) –>
<img src=”image/dev_flow_copy.jpg” width=”627″ height=”769″ border=”0″ alt=”” usemap=”#dev_flow_copy_Map”>
<map name=”dev_flow_copy_Map”>
<area shape=”rect” alt=”test” coords=”288,82,408,142″ href=”image/dev_req_copy.jpg”>
</map>
<!– End ImageReady Slices –>
</div>
[/code]

So, here each div has an ID and the corresponding image for that menu link is loaded in here, I want to have the imagemapped content load up in the same div, is this a Javascript/CSS mix code, how do you target a particular div to load up ?, I know the answer to this lies in targetting the div with the ID, but I don’t know how to implement the same

Can you please help ?

Thanks
JVJ

Also in #JavaScript _↴