jQuery cycle 影像自動播放效果

可快速加入包含多樣自動影像播放效果，準備好與要加入內容區相同尺寸的多張影像即可。

STEP1. 開啟範例練習檔dw09.html與dw09-jQueryCycle.html， 在dw09.html內刪除原內容區影像。

再至dw09-jQueryCycle.html內直接複選並貼入所需 CSS 與 Javasccript 檔連接於dw09.html的/head之前:

以及dw09-jQueryCycle.html程式碼body內的內容，複製並至dw09.html的內容區(刪去圖片的)td之內貼上:

STEP2. 更改撥放器尺寸 width:563px、height:380px:

接著更改撥放影像內容，首先可選擇刪去【div title=”sample title”……/div】為文字說明內容，再更改所要撥放影像檔案名稱(dw09p1.jpg~ dw09-p6.jpg)、尺寸與成為圖說文字的 title 即可。

儲存檔案預覽即可檢視到圓角矩形的圖框，左下角的說明文字顏色須修正。

STEP3. 最後就是可以更改圖外框顏色與左下角圖說文字顏色，請至 CSS 設計工具控制板上選取【#slideshow-caption】更改 color 文字顏色；選取【#slideshow img, #slideshow div】更改background-color 即是邊框顏色。

儲存檔案預覽即可檢視。

【檢視範例】【下載範例】

相關課程 : 優勢多媒體 - Dreamweaver專業網頁編輯應用