Dreamweaver CS3整合Spry效果圖文教程_Dreamweaver

在如今Web2.0盛行、AJAX流行的時代背景下，Adobe公司的輕量級的AJAX架構Spry，尤其是當Spry整合到Dreamweaver cs3時，這無疑是最令人興奮的。

排除與使用者互動有關的Spry XML資料互動和Spry相關視窗組件不談，最先讓使用者上手的就是Spry所帶來的Ajax視覺效果了。在Dreamweaver cs3單擊相關按鈕就可以輕鬆地向頁面元素添加視覺過渡, 以使它們擴大選取、收縮、漸隱、高光等等。

1，Spry Menu Bar

使用該按鈕可以建立橫向或縱向的網頁下拉或快顯功能表，Spry框架組成的SpryMenuBar.js指令檔無需我們來編寫菜單彈出代碼，同時，功能表列目均採用基於Web標準的HTML結構形式，編輯方便。



橫向菜單測試地址：http://www.dreamweavercs3.cn/demo/spry/spry_01.html

縱向菜單測試地址：http://www.dreamweavercs3.cn/demo/spry/spry_02.html

2，Spry Tabbed Panels

對於Windows作業系統使用者來說，選項卡功能並不陌生，但要在網頁中實現該功能確不是很輕鬆，現在藉助Spry tabbed panels可以很快完成，並且在Dreamweaver CS3中可以直接選擇各個主選項卡內的內容進行編輯。



測試地址：http://www.dreamweavercs3.cn/demo/spry/spry_03.html

3，Spry Accordion

我們都使用過QQ聊天軟體，當選擇“QQ好友”、“QQ群”或“最近連絡人”時，單擊該名稱就可上下自由滑開所選擇的內容而整個視窗不會發生變化。同樣，在網頁應用中，我們曾經為這些的“QQ菜單”而絞盡腦汁，現在，使用Spry accordion輕鬆搞定。