asp:UpdateProgress IE8 animated GIF stops animating

I am using the asp:SciptManager with the asp:UpdateProgress and the asp:UpdatePanel to display an animated GIF when long postbacks occur (let the user know the page is busy).  Unfortunately, I am restricted to using IE 8.  When my page runs and a button is clicked, the animated GIF displays and animates briefly.  But it stops animating and when the code behind is finished, the GIF disappears as desired.  I am wondering how can I get the image to animate for the entire code-behind cycle?

I have found numerous references to this problem with IE 8 but have NOT found a solution that works.  Worse, case I know I can take the animated GIF off and just display text such as "Processing...".  But, I would really like to get the animation working. 

Any suggestions?

Here is my code:

<asp:Content ID="BodyContent" runat="server"ContentPlaceHolderID="MainContent">
   <h2>Prepare Campaign File</h2>

   <asp:ScriptManager ID="ScriptManager1" runat="server"EnableHistory="true" EnablePartialRendering="true" EnablePageMethods="true"></asp:ScriptManager>

    <asp:UpdateProgress runat="server" ID="PageUpdateProgress">
        <ProgressTemplate>
            <div id="progressBackgroundFilter"></div>
            <div id="processMessage">Processing...<br /><br />
                <img id="progressImg" src="../Images/progress.gif"alt="Processing..."/>
            </div>
        </ProgressTemplate>
    </asp:UpdateProgress>

    <div style="padding-top:20px"></div>

    <asp:UpdatePanel runat="server" ID="UpdatePanel1">
        <ContentTemplate>
            <div>
                <div style="padding-top: 5px; padding-bottom: 5px;"></div>
                <asp:Panel ID="Panel1" runat="server" BorderStyle="Solid"BorderWidth="1" BorderColor="DeepSkyBlue" Width="1148px" Height="250px"Visible="false
                    <div style="padding-left:10px; padding-right:10px; padding-top: 10px;">
                        <table style="border-style: solid; border-width: 1px;padding-left: 20px; padding-top: 20px; width: 98%;">
                            <tr>
                                <td style="padding-top: 5px; padding-bottom: 5px;width: 18%;">
                                    <asp:Label ID="labelSelectCampaign"runat="server">Select Campaign To Load</asp:Label>
                                    <div style="padding-top: 5px; padding-bottom: 5px;">
                                        <asp:ListBox ID="ListBox1" runat="server"Width="200" Height="150" AutoPostBack="true"ontextchanged="ListBox1_TextChanged"></asp:ListBox
                                    </div>
                                    <div style="padding-top: 5px; padding-bottom: 5px; padding-left:65px; width:65px;"><asp:Button ID="buttonViewCampaign"runat="server" Text="View Campaign" Enabled="false"onclick="buttonViewCampaign_Click" /></div>
                                </td>
                                <td style="vertical-align: top; padding-left: 20px;">
                                    <div id="divGridViewScroll" runat="server"style="width: 100%; height:200px; overflow: scroll" visible="false">
                                        <asp:GridView ID="GridView1"runat="server" Visible="true"></asp:GridView>
                                    </div>
                                </td>
                            </tr>
                        </table>
                    </div>
                </asp:Panel>
            </div>
        </ContentTemplate>
    </asp:UpdatePanel>
<asp:Content>