|
1-8 of 8 DHTML Document Effects > Image Animation sites are shown.
|
|
Drag and drop scripts are entirely based around the mouse events. I will be using the DynAPI Mouse Event code, so if you haven't already, read that lesson to know what I'm talking about. This lesson will show step by step how to make one layer draggable. The next lesson will show how to make any number of layers draggable with a generic Drag Object.
|
|
|
|
|
|
The Drag Object is a unified piece of code which allows you to selectively make Dynamic Layers draggable with a minimal amount of coding. All that's needed is to set up the drag.js file, initialize your DynLayers, and then add them to the drag object.
|
|
|
|
|
|
This example shows how to have three images move around the screen.
|
|
|
|
|
|
This shows a neat little animation effect with balls that form an imaginary elastic cord that they bounce on
|
|
|
|
|
|
The basic technique for path animation is easy to understand. Once you have all the co-ordinates of where to move the layer, you just need a function to loop through them and move the layer to those points. For this purpose I've written a Path Object which will take care of this for you. You just have to add the object to your DynLayers and use the appropriate methods.
|
|
|
|
|
|
DuoPath is a freeware JavaScript application for making DHTML path animation for Netscape 4.0 and Internet Explorer 4.0. DuoPath is intended to be used along with the technique shown in the Path Animation lesson - it'll explain the concepts of how DuoPath can be used for your own purposes.
|
|
|
|
|
|
DuoPath is a freeware JavaScript application for making DHTML path animation for Netscape 4.0 and Internet Explorer 4.0. DuoPath is intended to be used along with the technique shown in the Path Animation lesson - it'll explain the concepts of how DuoPath can be used for your own purposes.
|
|
|
|
|
|
This piece of code gives you the kind of control that is necessary for any type of gif animation sequence you can think of.
|
|
|
|
|