十五、UpdatePanelAnimation——带有动画效果的Updatepanel、DragPanel——拖放功能

 

UpdatePanelAnimation带有动画效果的Updatepanel

 

举例如下：

1.       添加一个ScriptManage

2.       添加一个UpdatePanel，并向其中添加一个button

3.       编写响应的button方法

    protected void Button1_Click(object sender, EventArgs e)

    {

        System.Threading.Thread.Sleep(6 * 1000);   //延时六秒

        Button1.Text = DateTime.Now.ToString();

    }

4.       添加一个UpdatePanelAnimation

        <asp:UpdatePanel ID="UpdatePanel1" runat="server">

            <ContentTemplate>

                <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />

            </ContentTemplate>

        </asp:UpdatePanel>

        <cc1:UpdatePanelAnimationExtender ID="UpdatePanelAnimationExtender1" runat="server" TargetControlID="UpdatePanel1">

            <Animations>

                <OnUpdated>             //更新后的动画

                    <Sequence>

                        <Parallel duration="2" Fps="30">            //动画

                            <Color StartValue="#ff3f3f" EndValue="#ffffff" Property="style" PropertyKey="backgroundColor"> </Color>

                        </Parallel>

                    </Sequence>

                </OnUpdated>

                <OnUpdating>            //更新时的动画

                    <Sequence>

                        <Parallel duration="2" Fps="30">

                            <EnableAction Enabled="true"></EnableAction>

                            <Color StartValue="#fffeee" EndValue="#eeefff" Property="style" PropertyKey="backgroundColor"> </Color>

                        </Parallel>

                    </Sequence>

                </OnUpdating >

            </Animations>

        </cc1:UpdatePanelAnimationExtender>

 

 

DragPanelExtender可以使Panel控件变得可拖动，要拖放一个元素，只需要简单的将其放入panel中，然后再将DragPanelExtender放到页面并设置属性就可以了,不过感觉它的作用不大

 

举例如下：

1.       添加一个ScriptManage

2.       添加一个Panel

        <asp:Panel ID="Panel1" runat="server">

            <div id="title" style="background-color:Blue;">title.....................title</div>

            <div id="content" style="background-color:Gray;">content<br /><br /><br />content</div>

        </asp:Panel>

3.       添加一个DragPanelExtender

        <cc1:DragPanelExtender ID="DragPanelExtender1" runat="server"

                               TargetControlID="Panel1"    // Panel控件的ID

                               DragHandleID="title">     //作为手柄的元素ID，该元素必须在被拖动的Panel中

        </cc1:DragPanelExtender>