Hide image map without hiding custom banner?

Question

Instead of a nav bar I decided to go with an image map. I also have a custom banner, both of which are in the "custom header" section of the advanced site wide customization. My problem is that I want to hide the image map from every page except the home page while KEEPING the custom banner on ALL pages including the home page. Is there a simple way to do that without adding script to hide for each and every individual gallery?

Thanks!

Answer 1

That's where CSS IDs/classes come in. You can wrap your image map and header with a separate ID using a div tag like this:

<div id="myimagemap">
here comes your imagemap
</div>

and then you can address that ID with CSS code. For example this would generally hide the imagemap:

#myimagemap {
  display: none;
}

and with the following code it would be enabled on your homepage:

.homepage #myimagemap {
  display: block;
}

For an overview on CSS, check out this guide and as a reference on html, CSS and more, head to w3schools.