Herzlichen Dank an alle für die Vorschläge.

Inzwischen habe ich aus einer anderen Quelle einen funktionierenden Lösungsvorschlag erhalten, den ich euch nicht vorenthalten möchte:

Das overlay ist jetzt statt über eine Klasse mit einer ID definiert (statt .overlay jetzt #overlay) und auf display: none; gesetzt.
Dann wird es über jedes einzelne a in meiner Navigation wie folgt angesprochen:

  
<a href="#" onmouseover="overlay.style.display='block'" onmouseout="overlay.style.display='none'" >  
	<img class="menueicon" src="images/Produkt_A_Icon.png" alt="Produkt_A_Icon" width="40" height="40"> Produkt A  
</a>  

Funktioniert einwandfrei.

Gruß
dieselross