Small width layout Medium width layout Maximum width layout Small text Medium text Large text
     Search
Downloads Downloads Directory Directory Forums Forums Forge Forge Blogs Blogs        Marketplace Marketplace Careers Program Careers
Community › Forums Register  |  

Maximum ASP
  Need Help?  
Professional technical support for DotNetNuke is available from DotNetNuke Corporation.
 


  Ads  
Biz Modules provides professional business modules and solutions for DotNetNuke
 


  Sponsors  

Meet Our Sponsors

The best choice for your web site host, email hosting, and domain registration.
CrystalTech Web Hosting™
Webhost4life, specialists in DNN hosting
Mad Development is a full service interactive agency focusing on the merge of design, technology, e-commerce, and affiliate marketing by providing total website solutions.
AspDotNetStoreFront - E-Commerce by Design - The Leading ASP.NET shopping cart platform for developers!
Click here to go to dev.live.com for Windows Live developer resources
 


DotNetNuke Forums
 
  Forum  General DotNetN...  Configure It! (...  Image map problem
Previous Previous
 
Next Next
New Post 6/4/2008 7:00 PM
User is offline jdecarolis
1 posts
10th Ranked


Image map problem 

I've created an image map with rollover effects in Dreamweaver, and want to insert the code into a DNN text/html module. It works fine, except that the imagemap spills out over the edge of the container and actually covers other containers on the webpage. I know this has to do with the use of absolute positioning, but after some experimentation, I can't get it to work properly. Any help would be greatly appreciated. Here's the html generated by Dreamweaver:

<div id="overLayer-AltE" style="position:absolute; width:200px; height:115px; z-index:3; clip: rect(0px,190px,158px,0px); visibility: hidden;"><img src="imagemap2.jpg" width="570" height="481" border="0" usemap="#MainMap">
  <map name="MainMap">
    <area shape="rect" coords="-9,-10,191,156" href="http://www.homeenergyweb.com/Home/AlternativeEnergySystems/tabid/75/Default.aspx" alt="Alternative Energy" onMouseOver="MM_showHideLayers('overLayer-AltE','','show')" onMouseOut="MM_showHideLayers('overLayer-AltE','','hide')">
    <area shape="rect" coords="190,4,380,158" href="http://www.homeenergyweb.com/Home/Appliances/tabid/79/Default.aspx" alt="Appliances" onMouseOver="MM_showHideLayers('overLayer-Appliances','','show')" onMouseOut="MM_showHideLayers('overLayer-Appliances','','hide')">
    <area shape="rect" coords="380,-12,637,158" href="http://www.homeenergyweb.com/Home/HeatingandCooling/tabid/80/Default.aspx" alt="Heating and Cooling" onMouseOver="MM_showHideLayers('overLayer-HC','','show')" onMouseOut="MM_showHideLayers('overLayer-HC','','hide')">
    <area shape="rect" coords="0,157,190,320" href="http://www.homeenergyweb.com/Home/Landscaping/tabid/82/Default.aspx" alt="Landscaping" onMouseOver="MM_showHideLayers('overLayer-Land','','show')" onMouseOut="MM_showHideLayers('overLayer-Land','','hide')">
    <area shape="rect" coords="380,158,569,320" href="http://www.homeenergyweb.com/Home/Lighting/tabid/83/Default.aspx" alt="Lighting" onMouseOver="MM_showHideLayers('overLayer-Light','','show')" onMouseOut="MM_showHideLayers('overLayer-Light','','hide')">
    <area shape="rect" coords="2,320,188,479" href="http://www.homeenergyweb.com/Home/Vehicles/tabid/84/Default.aspx" alt="Vehicles" onMouseOver="MM_showHideLayers('overLayer-Vehicles','','show')" onMouseOut="MM_showHideLayers('overLayer-Vehicles','','hide')">
    <area shape="rect" coords="188,320,379,480" href="http://www.homeenergyweb.com/Home/InsulationandWeatherization/tabid/81/Default.aspx" alt="Weatherization" onMouseOver="MM_showHideLayers('overLayer-Weath','','show')" onMouseOut="MM_showHideLayers('overLayer-Weath','','hide')">
    <area shape="rect" coords="381,321,571,479" href="http://www.homeenergyweb.com/Home/Windows/tabid/85/Default.aspx" alt="Windows" onMouseOver="MM_showHideLayers('overLayer-Windows','','show')" onMouseOut="MM_showHideLayers('overLayer-Windows','','hide')">
  </map>
</div>
<div id="overLayer-Appliances" style="position:absolute; width:200px; height:115px; z-index:4; clip: rect(0px,379px,158px,189px); visibility: hidden;"><img src="imagemap2.jpg" width="570" height="481" border="0" usemap="#MainMap"></div>
<div id="overLayer-HC" style="position:absolute; width:200px; height:115px; z-index:5; clip: rect(0px,569px,159px,380px); visibility: hidden;"><img src="imagemap2.jpg" width="570" height="481" border="0" usemap="#MainMap"></div>
<div id="overLayer-Land" style="position:absolute; width:200px; height:115px; z-index:6; clip: rect(159px,189px,320px,0px); visibility: hidden;"><img src="imagemap2.jpg" width="570" height="481" border="0" usemap="#MainMap"></div>
<div id="overLayer-Light" style="position:absolute; width:200px; height:115px; z-index:7; clip: rect(159px,569px,319px,380px); visibility: hidden;"><img src="imagemap2.jpg" width="570" height="481" border="0" usemap="#MainMap"></div>
<div id="overLayer-Vehicles" style="position:absolute; width:200px; height:115px; z-index:8; clip: rect(320px,189px,480px,0px); visibility: hidden;"><img src="imagemap2.jpg" width="570" height="481" border="0" usemap="#MainMap"></div>
<div id="overLayer-Weath" style="position:absolute; width:200px; height:115px; z-index:9; clip: rect(320px,380px,480px,189px); visibility: hidden;"><img src="imagemap2.jpg" width="570" height="481" border="0" usemap="#MainMap"></div>
<div id="overLayer-Windows" style="position:absolute; width:200px; height:115px; z-index:10; clip: rect(320px,569px,480px,380px); visibility: hidden;"><img src="imagemap2.jpg" width="570" height="481" border="0" usemap="#MainMap"></div>
<div id="offLayer" style="position:absolute; width:200px; height:115px; z-index:2; visibility: visible;"><img src="imagemap1.jpg" width="570" height="481" border="0" usemap="#MainMap"></div></td>

 
 
 Page 1 of 1
Previous Previous
 
Next Next
  Forum  General DotNetN...  Configure It! (...  Image map problem
 


Forum Policy

These Discussion Forums are dedicated to the discussion of the DotNetNuke Web Application Framework.

For the benefit of the community and to protect the integrity of the project, please observe the following posting guidelines:

1. No Advertising. This includes promotion of commercial and non-commercial products or services which are not directly related to DotNetNuke.
2. Discussion or promotion of DotNetNuke product releases under a different brand name are strictly prohibited.
3. No Flaming or Trolling.
4. No Profanity, Racism, or Prejudice.
5. Site Moderators have the final word on approving/removing a thread or post or comment.
6. English language posting only, please.
 


DNN SEO
Seablick Consulting specializes in DNN search engine optimization (SEO), DNN consulting, as well as support & training.
seablick.com 		Intura Vision / Intura Enterprise
Point-of-Sale and business management applications targeted towards quick service, fast casual and delivery-based restaurant concepts.
www.intura.com 		Dnaxp.Net
Dnaxp.Net offers a comprehensive base of information, resources, and support for DotNetNuke.
www.dnaxp.net

DotNetNuke Corporation   Terms Of Use  Privacy Statement
DotNetNuke®, DNN®, and the DotNetNuke logo are trademarks of DotNetNuke Corporation
Hosted by MaximumASP