Home > Products > Dreamweaver > Support > Dynamic Layers
Dreamweaver Icon Macromedia Dreamweaver Support Center - Dynamic Layers
Animating layers in a Dreamweaver 4 timeline

Many web designers add visually stimulating animation to a web page to catch the visitor's eye. Programming animation in code requires knowledge of Dynamic HTML (DHTML) and JavaScript, but you can create web page animation directly in Macromedia Dreamweaver without having to write one line of code. You simply add a layer to a timeline, define its animation path, and let Dreamweaver write the code for you.

You can use a Dreamweaver timeline to animate any object you insert in a layer—an image, text, table, form, and so on. You can then move, resize, and affect the visibility of the layer across a time continuum. If you aren't already familiar with using layers, see the Using layers to design a web page article before reading this one.

Since timelines utilize JavaScript and DHTML, they can only be viewed in version 4 or later browsers.

In this article, you'll learn how to use the Dreamweaver Timelines panel to create and modify animations. Before you begin, view the Timeline sample file. The sample file includes three animations—an image moving across the screen, a block of text moving in a non-linear path, and a navigation menu which shows up on the right side of the screen.

About timelines
Using the Timelines panel
Creating a timeline animation
Adding a keyframe to alter an animation path
Recording an animation path
Setting animation timing
Showing and hiding layers

Kim Diezel

Kim Diezel is a senior instructional designer on the Dreamweaver documentation team.

27 January 2002

tutorial, layers, animation, timeline