★Animation01★

わんくま同盟ホームわんくま同盟の最新記事 MyBlog 　　　Ognac試行部屋　　　

ホーム

スタイル : Mouse_OnHoverOver OnHoverOut

スクリプト・アクションを挟む : クリックで開始

スケール(拡大) : クリックで開始

パルス (ウィンク): クリックで開始

パラレル(何の?): クリックで開始

透明化: Mouse HoverOver/Out

フェードアウトしてハイド : ボタンクリックで開始

フェードアウト: クリックで開始

Enable : ボタンクリックで開始

複数効果のコンディション : クリックで開始

フェードイン
リサイズ
色の変化

前景色　: クリックで開始

フェードイン/リサイズ/色の変化を選択: クリックで開始

フェードイン/アウト: クリックで開始

御託

★Animation01★

ソース


■e:\user\cervi.reseller\ognadmin\ognogn.com\www\AJAX\Control\Animation\Animation01.aspx■
<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Animation01.aspx.cs" Inherits="AJAX_Control_Animation_Animation01" Title="無題のページ" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<hr />
        <asp:Panel ID="PNL13" runat="server" BackColor="White" BorderColor="Black" BorderStyle="Solid"   BorderWidth="1px" Width="300px">
        スタイル : Mouse_OnHoverOver  OnHoverOut
        </asp:Panel>
        <cc1:AnimationExtender ID="anim13" runat="server" TargetControlID="PNL13">
            <Animations>
                <OnHoverOver>
                   <StyleAction Attribute="backgroundColor" Value="#00ff00"/>                
                </OnHoverOver>
                <OnHoverOut>
                    <StyleAction Attribute="backgroundColor" Value="#FF00FF"/>                
                </OnHoverOut>
            </Animations>
        </cc1:AnimationExtender>

<hr />
        <asp:Panel ID="PNL12" runat="server" BackColor="White" BorderColor="Black" BorderStyle="Solid" BorderWidth="1px" Width="300px">
        スクリプト・アクションを挟む : クリックで開始
        </asp:Panel>
        <cc1:AnimationExtender ID="anim12" runat="server" TargetControlID="PNL12">
            <Animations>
                <OnClick>
                    <Sequence>
                        <ScriptAction Script="alert('開始');" />
                        <Color Duration="1" Fps="30" StartValue="#FFffFF" 
                            EndValue="#000000" Property="style" 
                            PropertyKey="backgroundColor" />
                        <FadeOut Duration="2" Fps="30" />
                    </Sequence>
                </OnClick>
            </Animations>
        </cc1:AnimationExtender>

<hr />
        <asp:Panel ID="PNL11" runat="server" BackColor="White" BorderColor="Black" BorderStyle="Solid"    BorderWidth="1px" Width="300px">
        スケール(拡大) : クリックで開始
        </asp:Panel>
        <cc1:AnimationExtender ID="anim11" runat="server" TargetControlID="PNL11">
            <Animations>
                <OnClick>
                    <Scale Center="True" ScaleFactor="3" ScaleFont="True" />
                </OnClick>
            </Animations>
        </cc1:AnimationExtender>
<hr />
        <asp:Panel ID="PNL10" runat="server" BackColor="White" BorderColor="Black" BorderStyle="Solid" BorderWidth="1px" Width="300px">
        パルス (ウィンク): クリックで開始
        </asp:Panel>
        <cc1:AnimationExtender ID="anim10" runat="server" TargetControlID="PNL10">
            <Animations>
                <OnClick>
                    <Pulse maximumOpacity="1.0" minimumOpacity="0.1" Duration="0.5" />
                </OnClick>
            </Animations>
        </cc1:AnimationExtender>

<hr />
        <asp:Panel ID="PNL9" runat="server" BackColor="White" BorderColor="Black" BorderStyle="Solid"     BorderWidth="1px" Width="300px">
        パラレル(何の?): クリックで開始
        </asp:Panel>
        <cc1:AnimationExtender ID="anim9" runat="server" TargetControlID="PNL9">
            <Animations>
                <OnClick>
                    <Parallel Duration="2" Fps="30">
                        <Color StartValue="#0000FF" 
                            EndValue="#FFff00" Property="style" 
                            PropertyKey="backgroundColor" />
                        <FadeOut />
                    </Parallel>
                </OnClick>
            </Animations>
        </cc1:AnimationExtender>

<hr />
        <asp:Panel ID="PNL8" runat="server" BackColor="White" BorderColor="Black" BorderStyle="Solid"  BorderWidth="1px" Width="300px">
        透明化: Mouse HoverOver/Out
        </asp:Panel>
        <cc1:AnimationExtender ID="anim8" runat="server" TargetControlID="PNL8">
            <Animations>
                <OnLoad>
                    <OpacityAction Opacity="0.2"/>
                </OnLoad>
                <OnHoverOver>
                   <OpacityAction Opacity="1"/>
                </OnHoverOver>
                <OnHoverOut>
                    <OpacityAction Opacity="0.2"/>
                </OnHoverOut>
            </Animations>
        </cc1:AnimationExtender>

<hr />
        <asp:Panel ID="PNL7" runat="server" BackColor="White" BorderColor="Black" BorderStyle="Solid"  BorderWidth="1px" Width="300px">
         フェードアウトしてハイド : ボタンクリックで開始
        </asp:Panel>
        <asp:Button ID="Button1" runat="server" Text="実行" OnClientClick="return false;" /><br />
        <cc1:AnimationExtender ID="anim7" runat="server" TargetControlID="Button1">
            <Animations>
                <OnClick>
                    <Sequence>
                        <HideAction />
                        <Color AnimationTarget="PNL7"
                            Duration="1" Fps="30" StartValue="#FFffFF" 
                            EndValue="#00ff00" Property="style" 
                            PropertyKey="backgroundColor" />
                        <FadeOut AnimationTarget="PNL7"
                            Duration="2" Fps="30" />
                        <HideAction Visible="True" />
  
                    </Sequence>
                </OnClick></Animations>
        </cc1:AnimationExtender>

<hr />
        <asp:Panel ID="PNL6" runat="server" BackColor="White" BorderColor="Black" BorderStyle="Solid"  BorderWidth="1px" Width="300px">
        フェードアウト: クリックで開始
        </asp:Panel>
        <cc1:AnimationExtender ID="anim6" runat="server" TargetControlID="PNL6">
            <Animations>
                <OnClick>
                    <FadeOut maximumOpacity="1.0" minimumOpacity="0.1" />
                </OnClick>
            </Animations>
        </cc1:AnimationExtender>

<hr />
        <asp:Panel ID="PNL5" runat="server" BackColor="White" BorderColor="Black" BorderStyle="Solid"     BorderWidth="1px" Width="300px">
         Enable : ボタンクリックで開始
        </asp:Panel>
        <asp:Button ID="btnPlay" runat="server" Text="開始" OnClientClick="return false;" /><br />
        <cc1:AnimationExtender ID="anim5" runat="server" TargetControlID="btnPlay">
            <Animations>
                <OnClick>
                    <Sequence>
                        <EnableAction Enabled="False" />
                        <Color AnimationTarget="PNL5"
                            Duration="1" Fps="30" StartValue="#FFffFF" 
                            EndValue="#00ff00" Property="style" 
                            PropertyKey="backgroundColor" />
                        <FadeOut AnimationTarget="PNL5"
                            Duration="2" Fps="30" />
                        <EnableAction Enabled="True" />
                    </Sequence>
                </OnClick></Animations>
        </cc1:AnimationExtender>

<hr />
        <asp:Panel ID="PNL4" runat="server" BackColor="White" BorderColor="Black" BorderStyle="Solid"         BorderWidth="1px" Width="300px">
        複数効果のコンディション : クリックで開始
        </asp:Panel>
        <cc1:AnimationExtender ID="anim4" runat="server" TargetControlID="PNL4">
            <Animations>
                <OnClick>
                    <Parallel duration="2" Fps="30">
                        <Condition ConditionScript="$get('ctl00_ContentPlaceHolder1_fade').checked">
                            <FadeIn />
                        </Condition>
                        <Condition ConditionScript="$get('ctl00_ContentPlaceHolder1_resize').checked">
                            <Resize Height="200" />
                        </Condition>
                        <Condition ConditionScript="$get('ctl00_ContentPlaceHolder1_color').checked">
                            <Color PropertyKey="backgroundColor"
                                StartValue="#8080FF" EndValue="#FFff00"  />
                        </Condition>
                    </Parallel>
                </OnClick>
            </Animations>
        </cc1:AnimationExtender>
        <asp:CheckBox ID="fade" runat="server" Text="フェードイン" />
        <br />
        <asp:CheckBox ID="resize" runat="server" Text="リサイズ" />
        <br />
        <asp:CheckBox ID="color" runat="server" Text="色の変化" />

<hr />
        <asp:Panel ID="PNL3" runat="server" BackColor="White" BorderColor="Black" BorderStyle="Solid"  BorderWidth="1px" Width="300px">
        前景色　: クリックで開始
        </asp:Panel>
        <cc1:AnimationExtender ID="anim3" runat="server" TargetControlID="PNL3">
            <Animations>
                <OnClick>
                    <Color Duration="2" Fps="30" StartValue="#000000" 
                        EndValue="#00FFFF" Property="style" 
                        PropertyKey="color" />
                </OnClick>
            </Animations>
        </cc1:AnimationExtender>

<hr />
        <asp:Panel ID="PNL2" runat="server" BackColor="White" BorderColor="Black" BorderStyle="Solid" BorderWidth="1px" Width="300px">
            フェードイン/リサイズ/色の変化を選択: クリックで開始
        </asp:Panel>
        <cc1:AnimationExtender ID="anim2" runat="server" TargetControlID="PNL2">
            <Animations>
                <OnClick>
                    <Case SelectScript="$get('ctl00_ContentPlaceHolder1_list').selectedIndex">
                        <FadeIn />
                        <Resize Height="200" />
                        <Color PropertyKey="backgroundColor"  StartValue="#FF00FF" EndValue="#FFff00"  />
                    </Case>
                </OnClick>
            </Animations>
        </cc1:AnimationExtender>
        <asp:DropDownList ID="list" runat="server">
            <asp:ListItem>フェードイン</asp:ListItem>
            <asp:ListItem>リサイズ</asp:ListItem>
            <asp:ListItem>色の変化</asp:ListItem>
        </asp:DropDownList>

<hr />
        <asp:Panel ID="PNL1" runat="server" BackColor="White" BorderColor="Black" BorderStyle="Solid"  BorderWidth="1px" Width="300px" Height="20px">
           フェードイン/アウト: クリックで開始
        </asp:Panel>
        <cc1:AnimationExtender ID="anim1" runat="server" TargetControlID="PNL1">
            <Animations>
                <OnClick>
                    <Sequence>
                        <Color Duration="1" Fps="30" 
                        StartValue="#00ffFF" 
                            EndValue="#FFff00" Property="style" 
                            PropertyKey="backgroundColor" />
                        <FadeOut Duration="1" Fps="30" />
                    </Sequence>
                </OnClick>
            </Animations>
        </cc1:AnimationExtender>
<hr />
</asp:Content>



■e:\user\cervi.reseller\ognadmin\ognogn.com\www\AJAX\Control\Animation\Animation01.aspx.cs■
using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;

public partial class AJAX_Control_Animation_Animation01 : System.Web.UI.Page
{
    protected void Page_PreInit(object sender, EventArgs e)
    {
        Page.Theme = (string)Session["テーマ"];
    }

    protected void Page_Load(object sender, EventArgs e)
    {


    }
}