2.2 | Pre-Built Functions |
I have created 7 special JavaScript functions to move a layer in a different manner: Circle, Spiral, Hovering, Sine Wave, Parabola, Figure-8, and Slanted Oval. Each of the functions use complicated mathematics to calculate where to move the layer. I won't bother explaining the math behind them because it would require that you take a course in advanced Geometry. But I've designed the functions so that all you have to do is set a few options and the function will do all of the mathematics for you. You can simply cut and paste the code into your pages.
For each of the examples I will be using a generic layer. It's just a red box with nothing in it. The functions will of course work no matter what you put inside the layer.
<LAYER NAME="layer1" LEFT=250 TOP=150 BGCOLOR=#FF0000 CLIP="0,0,30,30">
</LAYER>
If you need to use more than one of the same function (ie. 2 circles or 2 parabolas etc.) then you'll have to change all of the variable names in one of them. This is due to how I designed the functions - I made all the variables global. This was for ease of writing, testing, and using them. If you don't change the names the 2 functions will be using the same variables and will act very strangely because of it.
1.1 Introduction
1.2 Overlapping 1.3 Nesting 1.4 Using JavaScript |
2.1 Sliding Layers
2.2 Pre-Built Functions 2.3 Clipping Layers 2.4 Looping Animations 2.5 Changing Images |
3.1 Mouse-Click Animation
3.2 Capturing Keystrokes 3.3 Drag and Drop 4.1 Making Demos 4.4 Problems 4.5 Screen Sizes |
|