Обновление анимации с помощью jquery

Question

Я пытаюсь реализовать анимацию панели обновления с помощью jquery, я искал в Интернете, как это сделать, и вот мой код:

Руководитель:

<script type="text/jscript" src="http://code.jquery.com/jquery-latest.js"></script>
<style type="text/css">
    #Container 
    {
        padding: 10px;
        height: 100px;
        width: 200px;
        background: #D3CECE;
        border: 1px solid #1E36E7;
    }
</style>

Body:

<form id="form1" runat="server">
<div>    
    <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true">           
    </asp:ScriptManager>        
    <asp:Timer ID="Timer1" runat="server" Interval="4000" OnTick="Timer1_Tick"></asp:Timer>
    <asp:UpdatePanel ID="upOne" runat="server" UpdateMode="Conditional">
        <Triggers>
            <asp:AsyncPostBackTrigger ControlID="Timer1" EventName="Tick" />
        </Triggers>
        <ContentTemplate>
            <div id="Container">
                <asp:Label ID="LblTime" runat="server" Text="Time to be set"></asp:Label>
            </div>
        </ContentTemplate>
    </asp:UpdatePanel>            


<script type="text/javascript">

    var prm = Sys.WebForms.PageRequestManager.getInstance();        

    // Hook up Page Event Handler - called when panels are created/updated
    prm.add_pageLoaded(pageLoaded);

    // Handler implementation
    function pageLoaded(sender, args) {

        var panel = findPanel("<%= upOne.ClientID %>",
                              args._panelsUpdated);
        if (panel) {
            // find the embedded DIV tag container and fade it in
            var jPanel = $(panel);
            jPanel.fadeIn(1500);
        }
    }

    function findPanel(id, panels) {
        if (panels == null || panels.length < 1)
            return null;

        for (var i = 0; i < panels.length; i++) {
            var el = panels[i];
            if (el.id == id)
                return el;
        }

        return null;
    }

</script>
</div>
</form>

Он в основном обновляет метку asp: каждые 4 секунды, используя текущую дату и время в коде позади.

Я хочу применить эффект fadeIn к Div id = "Container", но по какой-то причине он не работает.

Может кто-нибудь заглянуть в код, чтобы увидеть, что я делаю не так. Спасибо.

Answer 1

Вы можете добавить строку перед jPanel.fadeIn (1500);с помощью jPanel.hide ();и это должно сработать.

Ссылка: нажмите здесь