I have an image map that I am displaying on the right of each page. The HTML code for the image map is inserted in a Content Block. The Content Block is inserted in the Main Sidebar using a Widget. I am using the Responsive Theme.
My problem is that underneath the image itself are a series of rectangles. Clicking on a rectangle under the image performs the same function as clicking an area of the image (i.e. it opens a new page).
I’m new to image maps, so I have no idea how to hide or remove these areas. Any help would be greatly appreciated.
My code looks like this:
<img class=”alignnone size-full wp-image-1506″ alt=”Learning Centre Menu” src=”http://website.address.au/wp-content/uploads/2013/06/Library-Menu.png” width=”249″ height=”796″ usemap=”#Map1″ />
<map name=”Map1″ id=”Map1″>
<area shape=”rect” coords=”0,0,30,168″ href=”http://website.address.au/?p=1131″ />
<area shape=”rect” coords=”0,171,31,361″ href=”http://website.address.au/?p=1145″ />
<area shape=”rect” coords=”0,360,32,463″ href=”http://website.address.au/?p=1176″ />