Hi there!
I have made 4 images for the mobile version of my website’s Homepage. Each image is optimized for a certain size of mobile device. I do not want to use a single image and have it resized automatically, as I want to make optimal use of the space available. Each image consists of different areas, linking to different internal or external webpages (an image map). So the idea was to simply connect a USEMAP to each specific IMAGE as you can see below. However when I implemented this, all 4 images use the coordinates of the first USEMAP resulting in wrong linking. Can anybody please help me to link each picture to the right USEMAP?
<IMG SRC="images/picture1.jpg" USEMAP="#picture1_Map"
srcset="images/picture2.jpg 320w" USEMAP="#picture2_Map"
srcset="images/picture3.jpg 375w" USEMAP="#picture3_Map"
srcset="images/picture4.jpg 414w" USEMAP="#picture4_Map">
