在許多網頁中，當鼠標移到一張圖片上時，又彈出另一張圖片，做這種廣告條，要用到Macromedia Dreamweaver中的Layer(層)和Timeline(時間軸)功能，還得準備兩張大小基本相同的廣告圖片。我們已最新版本Dreamweaver4.0（英文版）為例，制作移動的廣告條。 

　　一、用Dreamweaver打開任意一個網頁，空白頁也可。在菜單中選擇“插入Insert”-> “層Layer”,即看到網頁中多了一個空白Layer1，你也可以為他命名。再將光標點到空白Layer1內，選擇“插入Insert”-> “interactive Image”-> “rollover image”，在彈出的對話框中分別插入你的廣告條的圖片（請注意original image 表示第一張圖片，rollover image　表示當鼠標移到第一張圖片時，又出現的圖片，而且一定要把preload rollover image選中），調整層大小，使層盡可能與圖片大小相近。

　　二、在菜單欄選擇“修改Modify”-> “時間軸Timeline”-> “添加對象到時間軸Add object to Timeline”。點擊后，彈出對話框，告訴你只有圖象和層才能添加到時間軸。對話框按確定后，我們選中Layer（單擊層標記或層邊界，或用層面板選擇一層，當一個層被選中時，層邊界會顯示出調整大小手柄，按住鼠標左鍵不放，拖進時間軸動畫欄的第一頻道，即面板上豎寫1，2，3等等的“1”那行，時間軸里面馬上增加了一個默認的15幀動畫。

　　然后，單擊動畫欄最后關鍵幀標記，再選中頁面中的層Layer1，將它拖動到動畫的結束點，或者在“層的屬性面板”改變層的“左L”屬性大小來確定結束幀層的位置。此時，頁面中顯示了從動畫起始位置到結束位置有一線條，這就是層的運動軌跡。要想讓頁面打開時候它就開始運動，就在“時間軸TimeLine”面板上的“自動播放Autoplay”前打勾，如圖3所示：按在時間軸上中部的“-> ”箭頭不放，就可以直接預覽這直線動畫了，或者按下F12鍵預覽。

　　接下來，我們要進行一系列美化工作，因為這個簡單的直線運動效果并不美觀，而且廣告圖片也沒有產生變化。

　　三、改變時間欄的屬性產生移動變化

　　（1）在動畫移動距離不變的情況下，改名動畫移動速度。因為我們拉層進時間軸面板起始時候的幀數是默認的15幀，在上面預覽時候就感到速度有點快。要改變速度，我們就得改變動畫總共幀數。鼠標左擊選中“時間軸面板”中的“第一頻道”結束幀不放，向右拖動至你所想要的結束幀，例如75幀處，放開鼠標。此時，結束幀的空白小圓也移至到了第75幀處。按F12預覽一下，動畫的移動速度明顯變慢。但是要注意的是我們只是在保持動畫運動軌跡的長度不變的情況下，改變了動畫移動的速度，即時間軸上的幀數。如果在同時改變改變起始和結束幀層的位置，就會產生各種不同速度效果，讀者可以自己試著嘗試。

　　（2）產生曲線的運動。上面做的動畫只是簡單的直線運動，如果改變成曲線的運動，美觀程度就大大的加強了。曲線運動中最主要的就是關鍵幀的設置（只要學習過Flash的，這點非常容易理解）。

　　a.在“時間軸面板動畫欄”上添加一個關鍵幀: 選擇動畫欄的第一頻道中你想要添加關鍵幀處， 單擊鼠標右健，選擇“add keyframe”,即刻在插入點位置添加一個關鍵幀。

　　b.在添加的關鍵幀處移動層：在保證選中了后來添加的關鍵幀下，選擇頁面中的層，移動層至你所想要的地方。此時直線變化成了曲線。你可以多添加幾個關鍵幀，再移動層，使產生的曲線移動更加光滑。按F12鍵預覽，曲線效果是不是比以前的直線效果好多了？