Question

My webpage has a large image (a map). I want to position, at the top right of the image, a small icon that is for closing the map.

How can I figure out the position and place the image appropriately?

The image has a fixed width of 900 x 600.

I have jquery on the page if that helps.

I tried using $(“#map”).position and I have the top and left, but not sure how to position to the top right.

Answer 1

The easiest way would just to positon the close button absolutely with CSS instead of calculating the positon with JS. For example:

<div id="map" style="position: relative;">
  <img src="yourmap.png">
  <img src="close.png" style="position: absolute; top: 0; right: 0;">
</div>