PS網(wǎng)頁GIF動(dòng)畫廣告設(shè)計(jì)(3)

GIF動(dòng)畫最初顯示的圖像效果，如圖12-3-17所示。

圖12-3-17

GIF動(dòng)畫播放至中間所顯示的漸變效果，如圖12-3-18所示。

圖12-3-18

GIF動(dòng)畫閃爍后播放至最后一張圖像所顯示的效果。如圖12-3-19所示。

圖12-3-19

12.3.2網(wǎng)頁中透明GIF圖片的制作

在網(wǎng)頁的制作過程中總是少不了透明GIF圖像的添加，往往網(wǎng)頁中透明圖像的添加并不像圖片和動(dòng)畫中的那么簡(jiǎn)單，所以我們?cè)谔砑訒r(shí)需要使用ps來完成這項(xiàng)工作。

1.打開或制作一個(gè)需要制作成透明GIF圖片的PSD文件，如圖12-3-20所示。

2.在圖層面板中將最底層的白色背景刪除掉，或者將圖案圖層白色的部分刪除掉。讓當(dāng)前圖像顯示為圖12-3-21中的效果，也就是透明的狀態(tài)。

圖12-3-20圖12-3-21

3.在菜單欄上選取【圖像】>【裁切】，打開裁切對(duì)話框，如圖12-3-22所示。在【基于】類別中選中【透明像素】項(xiàng)，這樣就可以按照像素所在區(qū)域進(jìn)行自定剪裁。如圖12-3-23所示。

圖12-3-22圖12-3-23

4.剪裁好以后，在【文件】菜單欄中選擇【存儲(chǔ)為Web和設(shè)備所用格式】項(xiàng)。在打開后的對(duì)話框中將優(yōu)化的文件格式選擇為GIF或PNG，接著再將選項(xiàng)后面的【透明度】想勾選。如圖12-3-24所示。

圖12-3-24

5.另外需要我們注意的就是GIF圖像的雜邊設(shè)置。如果這個(gè)透明GIF圖像是要用到一個(gè)底色為藍(lán)色或綠色的網(wǎng)頁中，那么就需要使用雜色來使圖片邊緣和網(wǎng)頁很好的結(jié)合。在設(shè)置雜邊時(shí)，為了使顏色更準(zhǔn)確可以先在網(wǎng)頁中取得底色的顏色值，然后再將雜邊的顏色值設(shè)置為和底色的一樣即可。如圖12-3-25所示。

圖12-3-25

6.設(shè)置完畢后點(diǎn)擊【存儲(chǔ)】按鈕將圖片保存，然后在Dreamweaver中插入該圖片時(shí)就可以看到之前設(shè)置的透明效果。