Programming ASP.NET AJAX

Chapter 11. Adding Animation to a Web Page

One key component of the ASP.NET AJAX Control Toolkit is a powerful animation framework that provides several means to create complex animations without the need for extensive JavaScript coding. This chapter will examine how to take advantage of that framework. We’ll also touch on a related feature of the Control Toolkit—drag-and-drop support.

Note, the examples in this chapter require you to have installed the ASP.NET AJAX Control Toolkit. You will also need to have a web site configured to use the toolkit. For details on the Control Toolkit, see Chapter 10.

Animation Framework

ASP.NET AJAX offers two choices to create animations with very little effort (both unsupported). You may choose either ASP.NET AJAX Futures, which provides several animation options (refer to Chapter 20 for an in-depth discussion), or you can use the ASP.NET AJAX Control Toolkit. Equipped with more than just some web controls for Ajax-y animation effects, the toolkit comes with an entire animation framework that we will explore through the examples in this chapter. It is hard to say which option will “win” in the end, but I would personally bet on the Control Toolkit, since this is more community-driven than Futures. Time will tell.

Animation Basics

The Control Toolkit animation framework provides web control the AnimationExtender element. First though, you need the property, TargetControlID, which must contain the ID of the element to be animated:

<ajaxToolkit:AnimationExtender ...