• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

13. Positioning HTML Elements > 13.10. Animating Circular Element Paths

Animating Circular Element Paths

NN 6, IE 5

Problem

You want to animate the position of an element in a circular path.

Solution

To animate a positioned element along a circular path, link the animeCirc.js library (Example 13-3 in the Discussion) to your page and invoke the initCircAnime( ) function with five parameters in the following sequence:

  1. ID of animated element (as string)

  2. x coordinate of start/end point of circle

  3. y coordinate of start/end point of circle

  4. Even integer value specifying the number of render points in the circle

  5. Integer value of relative radius of the circle

A typical set of values to put an element into motion might be as follows:

initCircAnime("rounder", 200, 200, 36, 10);

PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint