google maps overlay layer

Question

i'm trying to put a layer on top of my google maps to cover it up. There doesn't have to be any interaction with google maps, it's just one layer on top the other.

what i have now:

<div id="map">
   <div id="overlay"></div>
</div>   

in the map div i put my google maps, and the overlay layer has a background as big as the map div, but the google maps keeps putting itself on top.

Anyone an idee what i can do about it?

Answer 1

The API will overwrite anything inside the DIV you assign to the map as container. To cover the map you'd need to put your overlay div outside the map div with position:absolute