Title: Image Map not functioning
Last modified: June 27, 2022

---

# Image Map not functioning

 *  [jcyoga18](https://wordpress.org/support/users/jcyoga18/)
 * (@jcyoga18)
 * [3 years, 10 months ago](https://wordpress.org/support/topic/image-map-not-functioning/)
 * The ‘palette’ image on this home page shows the menu names on the ‘paint patches’,
   however, although the cursor changes to a pointing finger when hovering over 
   the image, clicking on any of the paint patches does not activate the relevant
   page. The map code exists, as you can see in the source code Lines 134 – 148,
   but seems to not be working as expected. Can anyone see errors or suggest fixes
   please? Thanks!
    -  This topic was modified 3 years, 10 months ago by [jcyoga18](https://wordpress.org/support/users/jcyoga18/).
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fimage-map-not-functioning%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 5 replies - 1 through 5 (of 5 total)

 *  [Alan Fuller](https://wordpress.org/support/users/alanfuller/)
 * (@alanfuller)
 * [3 years, 10 months ago](https://wordpress.org/support/topic/image-map-not-functioning/#post-15774822)
 * The divs overlaying the map are at z-index 100 which is higher layer than the
   map
 *     ```
       <div style="width: 25%; height: 25%; position: absolute; top: 5%; left: 32%; z-index: 100; cursor: pointer;"></div>
       <div style="width: 25%; height: 25%; position: absolute; top: 15%; left: 65%; z-index: 100; cursor: pointer;"></div>
       <div style="width: 25%; height: 25%; position: absolute; top: 50%; left: 70%; z-index: 100; cursor: pointer;"></div>
       <div style="width: 25%; height: 25%; position: absolute; top: 60%; left: 38%; z-index: 100; cursor: pointer;"></div>
       <div style="width: 25%; height: 25%; position: absolute; top: 50%; left: 10%; z-index: 100; cursor: pointer;"></div>
       <div style="width: 25%; height: 25%; position: absolute; top: 20%; left: 10%; z-index: 100; cursor: pointer;"></div>
       <map name="Map">
       <area alt="drawings" coords="185,9,376,206" shape="rect" href="http://www.awakeningtheeye.net/?page_id=8">
       <area alt="classes" coords="377,87,585,286" shape="rect" href="http://www.awakeningtheeye.net/?page_id=5">
       <area alt="calendars" coords="379,353,586,547" shape="rect" href="http://www.awakeningtheeye.net/?page_id=15">
       <area alt="personal history" coords="194,356,376,572" shape="rect" href="http://www.awakeningtheeye.net/?page_id=13">
       <area alt="exhibitions" coords="5,340,192,551" shape="rect" href="http://www.awakeningtheeye.net/?page_id=11">
       <area alt="paintings" coords="6,126,209,314" shape="rect" href="http://www.awakeningtheeye.net/?page_id=2">
        </map>
       ```
   
 *  [tugbucket](https://wordpress.org/support/users/tugbucket/)
 * (@tugbucket)
 * [3 years, 10 months ago](https://wordpress.org/support/topic/image-map-not-functioning/#post-15774833)
 *     ```
       #flower div {
         display: none;
       }
       ```
   
 * So in your #flower, above your map in the source, you have those divs. Those 
   interfering with your map. Add the above CSS to hide the divs and you’ll see 
   the map works fine.
 *  Thread Starter [jcyoga18](https://wordpress.org/support/users/jcyoga18/)
 * (@jcyoga18)
 * [3 years, 10 months ago](https://wordpress.org/support/topic/image-map-not-functioning/#post-15776207)
 * [@tugbucket](https://wordpress.org/support/users/tugbucket/) Thanks. I added 
   that code to style.css, but it had no effect.
 * [@alanfuller](https://wordpress.org/support/users/alanfuller/) Thanks. I see,
   but what needs to be done to make the map links work?
 *  [Alan Fuller](https://wordpress.org/support/users/alanfuller/)
 * (@alanfuller)
 * [3 years, 10 months ago](https://wordpress.org/support/topic/image-map-not-functioning/#post-15776944)
 * I dont know, because it is your code and I have no idea why it is coded that 
   way and the purpose of the six <div> above the map.
 * As I can’t see a reason, I’d simply delete them, but as I said, not my code and
   I don’t have the full picture of why they exist.
    -  This reply was modified 3 years, 10 months ago by [Alan Fuller](https://wordpress.org/support/users/alanfuller/).
 *  Thread Starter [jcyoga18](https://wordpress.org/support/users/jcyoga18/)
 * (@jcyoga18)
 * [3 years, 10 months ago](https://wordpress.org/support/topic/image-map-not-functioning/#post-15778048)
 * [@alanfuller](https://wordpress.org/support/users/alanfuller/) Ok, thanks. We’re
   in the same boat as this code pre-existed my involvement.

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Image Map not functioning’ is closed to new replies.

## Tags

 * [image map](https://wordpress.org/support/topic-tag/image-map/)

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 5 replies
 * 3 participants
 * Last reply from: [jcyoga18](https://wordpress.org/support/users/jcyoga18/)
 * Last activity: [3 years, 10 months ago](https://wordpress.org/support/topic/image-map-not-functioning/#post-15778048)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics