Hi,

I have the following code at the bottom of my master page:-

Code:
        <div id="overlay">
            <asp:Image ID="Image1" runat="server" ImageUrl="~/Images/Disable.gif" style="width: 100%; height:100%; opacity:0.6;filter:alpha(opacity=60)"/>
            <div id="IconImage">
                <asp:Image ID="Image2" runat="server" ImageUrl="~/Images/loader.gif"/>
            </div>
        </div>
And here is my CSS:-

Code:
#overlay {
     visibility: hidden;
     position: absolute;
     left: 0px;
     top: 0px;
     width:100%;
     height:100%;
     z-index: 1000;
}

#IconImage {
     position: absolute;
     left: 50%;
     top: 50%;
     z-index: 1010;
}
Here is my javascript:-

Code:
function overlay() {
	el = document.getElementById("overlay");
	el.style.visibility = (el.style.visibility == "visible") ? "hidden" : "visible";
}
And finally here is my code to trigger the overlay function which is called when I build my data:-

Code:
<asp:ImageButton ID="ImageButton1" runat="server"  style="Height:50px; Width: 50px;" ImageUrl="~/Images/Printer.png" ToolTip="Print Report" OnClientClick="overlay()"/>
Everything works fine except my animated gif does not animate. If I load the gif in IE is animates.

Any ideas please?

Regards,

Roger