Client Side Animations

Last post 07-25-2007 1:02 PM by Phanatic. 15 replies.

Sort Posts:

  • Client Side Animations

    09-29-2006, 4:54 AM
    • Loading...
    • mattdurrant
    • Joined on 09-05-2006, 2:05 PM
    • Guildford
    • Posts 5

    There are plenty of examples on using the new animations server side with the UpdatePanelAnimateExtender, but I can't seem to find any help on creating a new animation client side through javascript. The animation reference page is helpful but could someone provide a working example? At the moment I keep getting 'AtlasControlToolkit' is not defined errors when trying to create a ColorAnimation.

     

  • Re: Client Side Animations

    10-05-2006, 5:57 PM
    Hi mattdurrant,

    Here's a simple example:
     
    <%@ Page Language="C#" %>
    <%@ Register Assembly="AtlasControlToolkit" Namespace="AtlasControlToolkit" TagPrefix="atlasToolkit" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server"><title>Test Page</title></head>
    <body><form runat="server"><div>
        <atlas:ScriptManager runat="server" />
        <atlasToolkit:AnimationExtender runat="server" />
        <button onclick="playAnimation();">Animate</button><br />
        <div id="myDiv">Content</div>
        
        
        <script type="text/javascript">
            function playAnimation()
            {
                AtlasControlToolkit.Animation.ScaleAnimation.play(
                    new Sys.UI.Control($('myDiv')), .5, 20, 5, 'px', false, true, 'pt');
            }
        </script>
    </div></form></body>
    </html>
    If you're getting errors about AtlasControlToolkit not being defined, it's because you're trying to use it before the scripts have loaded.

    Thanks,
    Ted
    This posting is provided "AS IS" with no warranties, and confers no rights.
    Filed under:
  • Re: Client Side Animations

    10-30-2006, 2:51 PM

    Does the same thing work for Beta as well?

     I included <ajaxToolkit:AnimationExtender runat="server"></ajaxToolkit:AnimationExtender>

    and it is giving me an error: "System.InvalidOperationException: The TargetControlID of '' is not valid. The value cannot be null or empty."

     

    Thanks. 

     

     

     

  • Re: Client Side Animations

    10-30-2006, 2:54 PM

    Posted too soon :)

     This works: <ajaxToolkit:AnimationExtender runat="server" ID="AnimationReference"></ajaxToolkit:AnimationExtender>

     

    forgot to set the ID :)
     

  • Re: Client Side Animations

    10-30-2006, 3:04 PM

    althougth the page loads up fine now, have to add TargetControlID and reference an empty ASPPanel to get it to work, but the following doesnt work

     HTML:

    <div id="faveThing" />

    Javascript on a Click Event:

    var _faveThingCTRL = new Sys.UI.Control($get('faveThing'));
    AjaxControlToolkit.Animation.FadeOutAnimation.play(_faveThingCTRL, 30, 5, 10, 80, true);


    Object of type "Object" cannot be converted to type AjaxControlTolkit.Animation.FadeOutAnimation;. Parameter name: instance

     

    Anyone know why?

     

    Thanks. 

  • Re: Client Side Animations

    10-30-2006, 4:39 PM
    Answer
    • Loading...
    • sburke_msft
    • Joined on 04-04-2006, 7:28 PM
    • Redmond, WA
    • Posts 770
    • AspNetTeam

    Don't create a new control.  Just pass an element:

    AjaxControlToolkit.Animation.FadeOutAnimation.play($get('faveThing'), 30, 5, 10, 80, true);  

     

    Don't forget, this posting is provided "AS IS" with no warranties, and confers no rights.
  • Re: Client Side Animations

    10-30-2006, 5:11 PM

    Thanks for the response, but I got the same error.

     
     Line: 603

    Error: Sys.ArgumentTypeException Object of type 'Object; cannot be converted to type 'AjaxControlToolkit.Animation.FadeOutAnimation'

    Parameter name: instance 

  • Re: Client Side Animations

    10-31-2006, 8:47 AM
    is there anyone that gotten the animation to work ? :)
  • Re: Client Side Animations

    11-03-2006, 8:04 AM
    • Loading...
    • daka
    • Joined on 10-30-2006, 1:37 PM
    • Posts 3
    Anyone please!
  • Re: Client Side Animations

    12-04-2006, 9:58 PM
    Hi daka,

    You're trying this code:
         AjaxControlToolkit.Animation.FadeOutAnimation.play($get('faveThing'), 30, 5, 10, 80, true); 
    and it's not working?

    Thanks,
    Ted

    This posting is provided "AS IS" with no warranties, and confers no rights.
  • Re: Client Side Animations

    01-29-2007, 6:22 PM
    • Loading...
    • mysorian
    • Joined on 11-06-2002, 8:27 PM
    • Plainsboro, NJ 08536
    • Posts 33
    Does not seem to work.
    jay
  • Re: Client Side Animations

    07-25-2007, 8:43 AM
    • Loading...
    • shawinder
    • Joined on 01-15-2005, 7:30 AM
    • INDIA
    • Posts 3
    i think <atlasToolkit:AnimationExtender should be

    <ajaxToolkit:AnimationExtender.... Also "TargetControlID" should need to be specified.

     

    Shawinder Pal Singh
    +919815071007
  • Re: Client Side Animations

    07-25-2007, 9:34 AM
    • Loading...
    • mysorian
    • Joined on 11-06-2002, 8:27 PM
    • Plainsboro, NJ 08536
    • Posts 33

    Here is a tutorial I wrote sometime ago that you may want to look at regarding animations. There are links to many other articles I have written on:

    SQL Server 2005, SQL Anywhere 10, ASP.NET 2.0<AjaxToolKit, Cold Fusion, Oracle XE, MS Access, MS FoxPro, Ajax, Dojo, Json and many others.

    http://hodentek.blogspot.com/2007/03/animation-with-ajax-tool-kit.html

    jay
  • Re: Client Side Animations

    07-25-2007, 12:36 PM
    • Loading...
    • Phanatic
    • Joined on 10-06-2005, 11:48 PM
    • Redmond , WA
    • Posts 393
    Phanatic
    This posting is provided "AS IS" with no warranties, and confers no rights.
  • Re: Client Side Animations

    07-25-2007, 12:59 PM
    • Loading...
    • mysorian
    • Joined on 11-06-2002, 8:27 PM
    • Plainsboro, NJ 08536
    • Posts 33

    The link appears to have been broken.

    Thanks

    jay
Page 1 of 2 (16 items) 1 2 Next >