0

Hi i'm trying to add image map to image is like menu that take the full width and height of html page and the image size is 640x960 pixels so i made the image responsive so when the page size is change if the browser re-size or when open it from mobile the image size change to take screen size i have successfully done that but now i need to add some click event to my image menu so i use HTML area co-ordinates attribute to detect shapes on my image to be able to click on this shapes so i statically did that by get the image-map of this image using GIMP and detect the shapes co-ordinates and every thing work well on the image size but when re-size the page and the image re-sized to be responsive the co-ordinates of the shapes not changing so how can i change the shapes co-ordinates dynamical when the image size re-sized. so please any help i don't want to make different size of my image and in each one take the shapes co-ordinates and detect what dives and what is the screen size to load the right image i need to do this in responsive way and many thanks for any help in advance.

Fadi
  • 2,320
  • 8
  • 38
  • 77
  • 1
    you can use Bootstrap... – yossico Sep 12 '14 at 10:25
  • ok but how can i detect the shape co-ordinates in the image and change it dynamically so to be able to click on this shape when ever the page is re-sized – Fadi Sep 12 '14 at 10:29
  • 2
    Ok, got ya, there is a solution here: http://stackoverflow.com/questions/13321067/dynamically-resizing-image-maps-and-images – yossico Sep 12 '14 at 10:34
  • 1
    feel free to upvote my comments ;) – yossico Sep 12 '14 at 10:35
  • thanks a loot i use the jquery lib to keep an imageMap scaled to a resizable image that David Bradshaw wort in the second answer from the question you link in your comment https://github.com/davidjbradshaw/imagemap-resizer – Fadi Sep 12 '14 at 10:57

0 Answers0