So, I'm pretty new and please excuse any silly questions.
I have my image that is set to a width of 93% to accommodate all screen resolutions. Said image needs to have hotspot map links on it to navigate the user to other parts of the webpage.

The issue I am running into is that, when the image scales according to a specific viewers screen resolution, the hotspots do not respond / follow / adjust. They are moved to other parts of the image and make no sense. Some google searching revealed that I need to set my image into a fixed position via pixels and not percents. How can I accommodate all screen resolutions that way? More googling said there is a JQuery plug-in that can help me, but I cannot figure out how to use it and get it working properly.

Can anyone help me with this, please? :[
This website is not live yet so I have to remove all related content from the coding below. Other than changed image URLs and titles, the coding is exactly what I have thus far:

Code:
<style type="text/css">
body,td,th {
	color: #e51827;
}
body {
	background-color: #000;
	style="height:100%"
</style>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Title_Here</title>
</head>


<body>
<center>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>
    
    <center>
    <img src="../images/bannerspace.jpg" width="93%"/>
    <p>
    <img src="../images/bannerspace.jpg" width="93%"/>
    <P>
    <img src="../images/bannerspace.jpg" width="93%"/>
    <P>
    <img src="../images/bannerspace.jpg" width="93%"/>
    </P>
</center>
    </td>
    
    <td>
    <img src="../images/mainimage.jpg" width="93%" usemap="#Map" border="0"/>   
    </td>
  </tr>

  <tr>
    <td>&nbsp;</td>
    <td>
<center>
          <!-- Counter Code START --><img src="http://www.e-zeeinternet.com/count.php?page=1049534&style=LED_r&nbdigits=5&reloads=1"  border="0" ><br><!-- Counter Code END -->
</center>
    </td>
  </tr>
</table>
</center>

<map name="Map" id="Map">
  <area shape="rect" coords="5,199,42,361" href="index.html" target="_self" alt="home" />
  <area shape="rect" coords="103,418,286,470" href="https://www.facebook.com" target="new" alt="facebook" />
  <area shape="rect" coords="368,458,563,495" href="contact.html" target="_self" alt="contact" />
  <area shape="rect" coords="712,190,744,377" href="enter.html" target="_self" alt="enter" />
  <area shape="rect" coords="114,127,297,178" href="availability.html" target="_self" alt="availability" />
  <area shape="rect" coords="436,207,577,252" href="currentprojects.html" target="_self" alt="currentprojects" />
</map>
</body>