Mask på billede

Hej

Jeg har en hjemmeside, hvor jeg kører et design, hvorpå at man ikke kan se hele billedet, men der nærmest er en mask på, altså så hjørnerne er runde osv.
Men nu vil jeg så lave et billede der er relativt, hvis man kan sige det sådan, et billede der engang imellem bliver skiftet ud, og for så ikke at sidde og "klistre" denne mask på samtlige billeder, er der så en smart måde, så den automatisk bliver lagt over idet billedet bliver vist.
Min mask er en gif fil (overlay.gif)


Jeg har fundet et stykke kode der gør det jeg gerne vil have, men den gør det kun idet man køre musen hen over billedet

----------

<style type="text/css">
.imgDiv {
    position: relative;
}
.delete {
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 2;
    display: none;
}
</style>

<script type="text/JavaScript">
function hideShowDelete(elm, show) {
    var im = elm.parentNode.getElementsByTagName("img")[0];
    im.style.display = show ? "inline" : "none";
}
</script>

<div class="imgDiv">
    <img src="img/overlay.gif" class="delete" onmouseover="hideShowDelete(this, 1)" onmouseout="hideShowDelete(this)">
    <img src="img/skildpadde.jpg" onmouseover="hideShowDelete(this, 1)" onmouseout="hideShowDelete(this)">
</div>


---------


Det skulle jo gerne være der konstant?!