title: Responsive Absolute Positioning
body: <p>I am trying to add a hover effect to each speech bubble in the image below that link to a different page when clicked on.</p>
  
  <p>Currently, I am using an image map and whenever an area of is hovered over jQuery changes the whole image to be the appropriate image that has the speech bubble filled in. It kind of works but IE flickers every time a hover happens and the website is responsive so the image map does not scale when the screen size is changed. I've tried using <a href="https://github.com/stowball/jQuery-rwdImageMaps" rel="nofollow noreferrer">https://github.com/stowball/jQuery-rwdImageMaps</a> too but it doesn't seem to work on a mobile device.</p>
  
  <p>Ideally I'd like to be able to have the speech bubbles be separate images that are positioned correctly when scaled so I can manipulate the speech bubbles easier.</p>
  
  <p>Screenshot</p>
  
  <p><img src="https://i.stack.imgur.com/Z59OG.png" alt="Screenshot of image"></p>