作（zuò）為（wéi）一位（wèi）不懂代碼（mǎ）的業餘網頁製作愛好者，常常羨慕專業程（chéng）序（xù）人員在瀏覽器中編製出的效果超酷的一（yī）些（xiē）多媒體作品。唉（āi），無奈（nài）程序那東東，酶澀南學，非一日（rì）之功，需要良好的邏（luó）輯思維能力和足（zú）夠的磨練方可成就。是不是不會程序（xù），就永遠就不能實現自己的創意和（hé）想法了呢？非也（yě）！現在我（wǒ）們（men）要製作的就是在網頁中的一個幻燈片播（bō）放器。當用戶按下控製盤（pán）上的“PLAY”鍵時圖（tú）片（piàn）將（jiāng）作（zuò）幻燈片似的連續循環播放（fàng）。按下“PAUSE”時，播放中（zhōng）的圖片就停（tíng）留在當前位置。按下“RESTART”鍵時，幻燈片又從頭播（bō）放。而這一（yī）切，僅僅采（cǎi）用（yòng）Dreamweaver3的內嵌的層（céng）（Layer）、時間鏈（Timeline）和行為（wéi）（Behavior）技術，就可實現，所有的JavaScript代碼都會（huì）在Dreamweaver中自動（dòng）生成。這（zhè）裏不是鼓勵（lì）大家不要（yào）接觸程序（xù）代碼，相反，若讀者掌握了一些編程技術的（de）基礎，會在（zài）網（wǎng）頁製作中（zhōng）起到相當重要（yào）的作用。實際上，這已是當今（jīn）專業WEB頁麵（miàn）製作人員的一項（xiàng）基本素質要（yào）求。

　　下麵分步驟對這個播放器（qì）的製作加以說明。

　　步驟一：圖形元素的製作和準備（bèi）。

　　製作幻（huàn）燈片所用的圖片並將之放入Dreamweaver的層中（zhōng）。我們準備在每（měi）個幻燈片中實現7幅圖片的交替變換，因（yīn）此我們需要製作7幅內容不同的圖片。注意圖片（piàn）要在Photoshop中進（jìn）行優化壓縮，並調整成相同的尺寸。建立一個層，插入初始圖片，該圖片就是幻燈片默認得（dé）頭一張圖（tú）片。將（jiāng）層命名為（wéi）Layer_main，並把該層的Index值設為1。

　　步驟二：製作播放（fàng）器的外（wài）觀和四個（gè）控製按鈕。

　　利用Photoshop製（zhì）作一個金屬效果的播放器外（wài）觀。（具體（tǐ）效果就看你的（de）喜（xǐ）好啦，也（yě）許你可從Winamp的skin中受（shòu）點（diǎn）啟（qǐ）發）。作最佳優化（huà）後，輸出（chū）一個透明的（de）GIF圖片。為了讓鼠標移上後按鈕有些變化，你不得不（bú）每個按鈕製作（zuò）2張圖片（共6個），兩個按（àn）鈕隻需有顏色上的差（chà）異即可。先建三個層，調（diào）整好位（wèi）置（zhì），並插（chā）入三個播（bō）放鍵的（de）各自的二張翻（fān）滾圖片（Rollover Image）（Insert-Rollover Image）。通（tōng）過（guò）調節層（céng）的Index-Z的值，確保播（bō）放器所在的層在（zài）Layer_main層的上麵（miàn），在按鈕所在層的（de）下麵。排版好的各（gè）層如圖所示（shì）。

　　步驟（zhòu）三：創建幻燈片播（bō）放時間鏈。

　　按Ctrl+F9鍵打開（kāi）時（shí）間鏈浮（fú）動工具麵板。選取（qǔ）其中幻燈片所在層(Layer_main)中的初始圖片(確保選取的是圖像，而不（bú）是層)，用鼠（shǔ）標拖至（zhì）時間（jiān）鏈浮動工具麵板，在時間鏈起始（shǐ）處釋放（fàng）鼠標。設定幀速率為Fps為5，並勾選Loop框。選擇時間鏈中的其中一幀，右擊鼠標，選擇"Add Keyframe"（添加關鍵幀（zhēn）），選（xuǎn）擇另一（yī）幅（fú）幻燈片圖片，以（yǐ）更換層(Layer_main)中的初始圖片。重複這個（gè）操作，將（jiāng）剩下的5幅圖片（piàn）全部加到（dào）該時間（jiān）鏈的不同關鍵（jiàn）幀上。最後適當調節各關鍵幀之間的距離。並將該時間鏈（liàn）命名為TimeLine_main。建立好的時（shí）間鏈（liàn）如（rú）圖所示。

　　步驟四：為按鈕（niǔ）和其它添加（jiā）行為（wéi）（Behavior）。

　　點擊（jī）選擇PLAY按鈕所（suǒ）在的圖片，在行為浮動工具麵（miàn）板中，從+（添加）動作下拉列表（biǎo）中選擇Timeline-Play Timeline(播放時間（jiān）鏈（liàn）)，並在彈出的對話框中選擇時間鏈（liàn）Timeline_main。單擊OK。默認（rèn）方式下，就會為切換動作設置一個onClick事件。點擊選（xuǎn）擇PAUSE所在（zài）的圖片。在行為浮（fú）動工（gōng）具（jù）麵板（bǎn）中（zhōng），從+（添加）動作下拉列（liè）表中選擇（zé）Timeline---Stop Timeline(停止播（bō）放時間鏈（liàn）)，並在彈出的對話（huà）框（kuàng）中選擇（zé）時間鏈Timeline_main。單（dān）擊OK。默認方式下（xià），就會為切換動作設置一個onClick事件（jiàn）。

　　點擊選擇（zé）REPLAY所在（zài）的圖片。在行為浮動工具（jù）麵（miàn）板（bǎn）中，從+（添加）動（dòng）作下（xià）拉列表中選擇Timeline---Go to Timeline Frame(轉向放時（shí）間鏈（liàn）幀)，並在彈出的對（duì）話框中選擇時（shí）間（jiān）鏈（liàn）Timeline_main，在（zài）Frame文本（běn）框中輸（shū）入1。單擊（jī）OK。默（mò）認（rèn）方式下（xià），就會為切換動作設置一個onClick事件（jiàn）。再添加下一個動作。從+（添（tiān）加）動作下（xià）拉（lā）列表中選擇Timeline---Play Timeline(播放（fàng）時間（jiān）鏈)，並在彈出的對（duì）話框中選擇時間鏈Timeline_main。單擊OK。默認方式下，就會為（wéi）切換動作設置一個onClick事件。REPLAY的圖（tú）片添加好的行為如圖所示。

　　本例（lì）中做好的播放器，可在下列地址（zhǐ）瀏（liú）覽：

http://webart.myrice.com/sample/index.htm。進一步，為了讓播放（fàng）器更加生動，你可以同時給幻燈片的播放加上聲（shēng）音。

　　若要把這個播（bō）放器放到網上，同時（shí）圖片總容量超過（guò）150K，可以給頁麵（miàn）作一個“Loading（加（jiā）載）層”，待全（quán）部內（nèi）容（róng）下（xià）載完畢後（hòu），才顯示出來。以免（miǎn）由（yóu）於圖（tú）片未下載完（wán）而產生（shēng）播放不暢的感覺。關（guān）於“Loading”層的製作（zuò）方法，在很多地方有介紹，這裏就不再詳述（shù）了（le）。

　　把這（zhè）個例子（zǐ）變通一下，我們可以作一個（gè）相冊。你可以把你的家庭或女朋友的相（xiàng）片加在幻燈（dēng）片（piàn）所在的時間鏈上，並且加上（shàng）Last（上一張）、 Next（下一張）等按鈕，便於瀏覽者逐（zhú）張欣（xīn）賞（shǎng）。若覺得相片太（tài）小不能看清楚（chǔ）細節（jiē），你還可以加（jiā）一個Zoom In（放大）按（àn）鈕，鏈（liàn）接到一個有單（dān）張放大相（xiàng）片的新窗口頁麵（miàn）。最（zuì）後把它（tā）放到網上，相信（xìn）一（yī）定會給你（nǐ）的家（jiā）人（rén）或女朋（péng）友帶去一份驚喜。