如何将内容保留在图像映射区域内

时间:2013-10-09 11:32:11

标签: image html map

以下是我正在使用的内容:http://shaneboland.com/ms2/contact.html

但这就是我想要的:http://shaneboland.com/ms2/test.jpg

我有一个包含我的表格的div:

<div id="wrapper">
    <div id="content-pad">
        <div id="mid-col-wide">
<form name="contactform" method="post" action="contact/send_form_email.php">
<table width="450px">
<tr>
 <td valign="top">
  <label for="first_name">Full Name *</label>
 </td>
 <td valign="top">
  <input  type="text" name="full_name" maxlength="50" size="30">
 </td>
</tr>
<tr>
 <td valign="top">
  <label for="email">Email Address *</label>
 </td>
 <td valign="top">
  <input  type="text" name="email" maxlength="80" size="30">
 </td>
</tr>
<tr>
 <td valign="top">
  <label for="comments">Message *</label>
 </td>
 <td valign="top">
  <textarea  name="comments" maxlength="1000" cols="25" rows="6"></textarea>
 </td>
</tr>
<tr>
 <td colspan="2" style="text-align:center">
  <input type="submit" value="Submit">
 </td>
</tr>
</table>
</form>
</div><!-- //mid-col -->

    </div><!-- //content-pad -->

</div><!-- //wrapper -->

然后我有一个单独的div,其中包含一个包含多个链接的图像映射:

<div align="center">
<img name="emp" src="contact/main.jpg" usemap="#ep" alt="Mammal Swag" width="940" height="801" border="0"/>
<map name="ep">
<area shape="poly" coords="20,144,176,159,183,222,42,223,20,144" href="about.html" onMouseOver="changeabout()" onMouseOut="changemain()"/>
<area shape="poly" coords="49,228,184,228,192,289,118,315,36,265,49,228" href="index.html" onMouseOver="changecontact()" onMouseOut="changemain()"/>
<area shape="poly" coords="675,639,692,607,773,607,754,713,693,712,675,639" href="http://www.facebook.com/MammalSwag" onMouseOver="changefacebook()" onMouseOut="changemain()"/>
<area shape="poly" coords="185,159,370,149,320,243,199,285,185,159" href="index.html" onMouseOver="changehome()" onMouseOut="changemain()"/>
<area shape="poly" coords="821,536,877,626,766,694,779,606,821,536" href="http://www.twitter.com/MammalSwag" onMouseOver="changetwitter()" onMouseOut="changemain()"/>  
</map>
</div>

我想这样做,以便我的联系表格div保持在那个大绿地内。因此,当窗口调整大小时,联系人表单div仍然位于绿色空间的同一位置。

如何使用我的图像映射调整我的联系表格div?

0 个答案:

没有答案