一、創(chuàng)建高效集成的應(yīng)用環(huán)境

為了使DreamWeaver和Firework的集成功能得到最大程度的發(fā)揮,你必須按照指定的順序正確的安裝他們,當(dāng)然如果你使用的是集成以后的安裝程序就可以忽略下面的操作了.

先啟動(dòng)Dreamweaver4的的安裝程序,完成以后再開始Firework4的安裝.這時(shí)Firework會(huì)在安裝的過(guò)程中自動(dòng)檢測(cè)本地是否已經(jīng)安裝了DreamWeaver.如果發(fā)現(xiàn)的話,它會(huì)自動(dòng)把必要的集成文件添加到相應(yīng)的子目錄中.如果你已經(jīng)搞錯(cuò)了順序,建議利用Firework的反安裝程序卸載掉,然后重新安裝.

至于具體的添加文件,這里就不細(xì)講了.不過(guò)為了方便你確定是否"集成"成功,可以在DreamWeaver安裝子目錄Dreamweaver4/Configuration/Objects/Common下查看是否存在Fireworks HTML.htm,Fireworks HTML.js兩個(gè)文件,有的話.基本就沒(méi)什么問(wèn)題了.

好的!現(xiàn)在我們看一下究竟如何在DreamWeaver中靈活的應(yīng)用Firework文件.這里的Firework格式文件除了包括一般的PNG或其他擴(kuò)展(GIF,GIF89a,JPEG)的圖片形式外,還有比較高級(jí)的Firework4 HTML文件.而我們所重點(diǎn)利用的也就是后者.

二、在DreamWeaver4中直接插入及編輯Firework圖片文件

在網(wǎng)頁(yè)中插入圖片文件應(yīng)該是最簡(jiǎn)單不過(guò)了,不論是何種格式的圖片都能夠通過(guò)菜單"Insert"-"Image"輕松的導(dǎo)進(jìn)來(lái).當(dāng)然你也可以通過(guò)"Object"面板上的"圖片插入"按鈕來(lái)實(shí)現(xiàn).

1、打開需要編輯的文件,將光標(biāo)定位到需要插入圖片的位置.

2、單擊"圖片插入"按鈕,然后在"Select Image Source"窗口中選定文件的具體路徑.如果圖片文件恰恰在網(wǎng)站根文件夾中,"確定"后不會(huì)有任何提示信息,如果是從網(wǎng)站以外引用的話,DreamWeaver會(huì)彈出如下的信息提示框:

單擊"是",在"另存為"對(duì)話框中選擇文件的保存目錄(默認(rèn)為網(wǎng)站的其實(shí)根目錄).

3、這時(shí)目標(biāo)圖片已經(jīng)進(jìn)來(lái)了,除了在網(wǎng)頁(yè)中調(diào)整該圖片對(duì)象的屬性(大小,顯示色彩等)外.你還可以直接調(diào)用Firework4對(duì)它進(jìn)行優(yōu)化處理.這也是兩者集成操作的一個(gè)表現(xiàn).

三、在Dreamweaver4中插入Firework4 HTML文件

鑒于大家可能對(duì)這個(gè)概念還比較模糊,下面我們先介紹一下什么是Firework4 HTML文件格式.顧名思義既然多了一個(gè)"HTML"的尾巴,當(dāng)然在輸出中就少不了這個(gè)東西了.Fireworks4的HTML文件中包含了與它相關(guān)聯(lián)的諸多信息:圖像的鏈接、圖像的切片信息以及javascript腳本語(yǔ)言等等.

大家都知道在Firework4中增加了很多以前在網(wǎng)頁(yè)中才能實(shí)現(xiàn)的效果,包括熱點(diǎn)控制,下拉菜單制作.而這些的實(shí)現(xiàn)都是需要類似javascript的腳本語(yǔ)言支持的.當(dāng)然我們現(xiàn)在用Firework制作就變的相對(duì)簡(jiǎn)單多了,并且程序本身提供的效果也是蠻不錯(cuò)的.

制作完成了,下面一個(gè)問(wèn)題就是如何在不影響效果的基礎(chǔ)上,將他們導(dǎo)入到指定的網(wǎng)頁(yè)中.根據(jù)不同的需求,我們提供了大概4種不同的導(dǎo)入方法:

　　1、以獨(dú)立的網(wǎng)頁(yè)文件輸出

這種情況可能比較少(多為設(shè)計(jì)性的網(wǎng)頁(yè)),不過(guò)在需要時(shí),倒是很簡(jiǎn)單.

完成以后,選擇菜單"File "-"Export",進(jìn)入文件導(dǎo)出窗口,如圖

在"保存類型"下拉列表中選擇"HTML and Images"即可.然后你就可以在瀏覽器里查看效果了.

2、利用"Insert Fireworks HTML"菜單或按鈕完成

不過(guò)畢竟Firework所產(chǎn)生的HTML文件更多的時(shí)候是作為網(wǎng)頁(yè)的某一部分出現(xiàn)的,因此DreamWeaver同時(shí)也提供了不錯(cuò)的導(dǎo)入功能.
注意一下,在DreamWeaver4的"Object"面板中有一個(gè)代表Firework的圖標(biāo).鼠標(biāo)懸停,你會(huì)得到一個(gè)"Insert Fireworks HTML"的提示信息,單擊這個(gè)按鈕就可以插入Firework導(dǎo)出的HTML文件了.具體的步驟如下:

1)保存當(dāng)前文檔到DW所在的站點(diǎn)目錄中.注意一定要輸出為.HTM的擴(kuò)展名,否則DreamWeaver在插入時(shí)不能夠正確識(shí)別,同時(shí)在網(wǎng)頁(yè)編輯窗口中定位好光標(biāo)位置.

2)單擊"Insert Fireworks HTML"按鈕或者使用菜單命令"Insert"-"Interactive Image"-"Fireworks HTML".在彈出的的對(duì)話框里單擊"Browse",選擇需要插入的Firework HTML文件,如圖