RIAnimation

Bring your projects to life - ASP.NET Animation

re·an·i·mate (rē-ăn'ə-māt')

1. To give new life to: Her dancing reanimates the classical style.
2. To bring to life; evoke powerfully or effectively: With RIAnimation you can reanimate your web applications.

RIAnimation = Rich Interactive Application Animation

Give your ASP.NET projects new life with RIAnimation. We have taken powerful JavaScript libraries (Prototype, JQuery and Interface) and developed a simple ASP.NET control for applying RIAnimations (Rich Interactive Animations) to any ASP.NET control. With RIAnimation, adding sophisticated interaction to your existing web apps is as easy as dropping our control on the form and setting three properties!

Live Demo

Check out the live demo here: http://labs.hushhushmedia.com/rianimation/demo/

Download

• HHM.RIAnimation (52.42 kb)
• HHM.RIAnimation Source (1.77 mb)
• HHM.RIAnimation 3.5 (53.71 kb)
• HHM.RIAnimation Source 3.5 (219.89 kb)

Drag, Drop & Pop

RIAnimation has a complete JavaScript Animation Compiling Class called RIAnimation.RIAnimationScripts. This can be used to build your own custom animations by passing paramaters to the script builders and getting a nice clean JavaScript black back. This is the route you will want to take as an advanced designer/developer hybrid to build your own animations.

To make animation easy we abstracted all of this work and made a crazy-simple control called the RIAnimator. This is an ASP.NET custom control which can be added to your toolbox just like any other. While this is a control, it only serves the purpose of adding animation to other ASP.NET controls. The idea is to give designers and developers a way to inject animation into any project without recoding a single line. This control has a few very simple properties that drive its functionality:

• TriggerControlID - The ID of the Control (Control, WebControl, or HTMLGenericControl) you wish to trigger an animation
• TriggerEvent - Event which fires the animation. Triggered by one of the following events 
  • Load
  • Unload
  • Click
  • DblClick
  • Toggle
  • HoverOver
  • HoverOut
  • MouseDown
  • MouseUp
  • MouseOver
  • MouseOut
  • MouseMove
  • KeyPress
  • KeyDown
  • KeyUp
  • Focus
  • Blur
  • Resize
  • Scroll
  
• Animation - The animation applied to the TargetControl
  • FadeIn
  • FadeOut
  • DropInFromTop
  • DropInFromBottom
  • DropInFromLeft
  • DropInFromRight
  • DropOutToTop
  • DropOutToBottom
  • DropOutToLeft
  • DropOutToRight
  • BlindUp
  • BlindDown
  • BlindLeft
  • BlindRight
  • Bounce
  • Fold
  • UnFold
  • Highlight
  • OpenVertically
  • OpenHorizontally
  • CloseVertically
  • CloseHorizontally
  • Pulsate
  • Grow
  • Shrink
  • Puff
  • Shake
  • SlideInFromTop
  • SlideInFromBottom
  • SlideInFromLeft
  • SlideInFromRight
  • SlideOutToTop
  • SlideOutToBottom
  • SlideOutToLeft
  • SlideOutToRight
  • StopAllAnimation
  
• TargetControlID [Optional] - ID of the Control (Control, WebControl, HTMLGenericControl) you wish to animate (Defaults to TriggerControlID)

Code Samples

Design Time

Code Behind (C#)

protected void Page_Load(object sender, EventArgs e)
{
HHM.RIAnimation.RIAnimator RIA = new HHM.RIAnimation.RIAnimator();
RIA.TriggerControlID = "PnlDemo";
RIA.TriggerEvent = HHM.RIAnimation.HHM.RIAnimation.Options.TriggerEvent.Load;
RIA.Animation = HHM.RIAnimation.HHM.RIAnimation.Options.Animation.UnFold;
this.Controls.Add(RIA);
}