加快圖片下載速度
如果網頁中有過多的圖片,就會影響瀏覽的速度。 Dreamweaver 可以輕鬆設定預載圖片,加快圖片下載速度,讓網站以最快的速度出現在使用者面前。
創作想法開啟Dreamweaver MX 2004 軟體新建頁面,再開啟標籤面板,在【行為】中選擇【預先載入影像】選項,加快圖片下載速度。
操作步驟
( 1 )新建文件,操作如圖36-1 所示。
( 2 )儲存頁面並插入圖片。為了在插入圖片時不提示相對路徑,先儲存頁面為「 36.htm 」。然後插入要預載的圖片,如圖36-2 所示。
圖36-2 插入圖片
( 3 )新增「預先載入影像」功能。使用Dreamweaver 的行為面板新增「預先載入影像」功能,如圖36-3 所示。
( 4 )選擇要預載的圖片,操作如圖36-4 所示。
提示:如果網站上有幾張大圖片,可以點選【預先載入影像】上方的【 + 】圖標,新增多張預載影像,具體操作與圖36-4 所示相同。
( 5 )儲存檔案完成操作。這樣就可以加快圖片的下載速度,讓使用者在瀏覽網頁時不會等太久,這對於提升網站的效能有著非常重要的意義。
隨機廣告圖片
瀏覽者瀏覽網頁時可以發現,網頁中動態更新的廣告圖片比靜態固定的圖像更具活力和吸引力。如何製作網頁中的隨機廣告圖片是本實例所要研究的問題。
效果說明在瀏覽網頁時,網頁的banner 區域將出現一張廣告圖片,如圖38-1 所示。隨後每兩秒更新一次廣告圖片,而且廣告圖片是以隨機的方式出現的,如圖38-2 所示。
創作想法透過使用Macromedia 的擴充插件Advance_Random_Images ,可以輕鬆地完成網頁中隨機廣告圖片的製作。
操作步驟
( 1 )安裝插件。使用選單列中的【指令】|【擴充管理】指令調出【 Macromedia 擴充管理器】對話框,安裝Advance_Random_Images 擴展,如圖38-3 所示。
( 2 )調用命令。開啟本實例來源資料夾中的banner.htm 文件,將遊標置於要插入廣告的位置上,並調出【 AdvancedRandomImages 】指令,如圖38-4 所示。
( 3 ) 設定影像。 在彈出的【 RandomImages 】對話方塊中對圖片變換屬性進行設定,如圖38-5 所示。
( 4 )新增圖片。新增第一張廣告圖片,如圖38-6 所示。
提示:本實例所用到的圖片放於本實例素材資料夾中的banner 資料夾中。
( 5 )接著用同樣的方法加入其他圖片,加入完成後點選【 OK 】按鈕確定操作,如圖38-7 所示。
( 6 )然後儲存頁面檔案並進行預覽,隨機廣告圖片的效果就製作出來了。讀者可參考本實例素材資料夾中的bannerok.htm 效果文件,看製作的結果是否正確。至此本實例製作完成。
本實例所講的技術常用於各類的網站中,如國內幾個較大的門戶網站上,幾乎在他們的每個頁面中都可看到這些變換廣告,讀者可參考這些內容來多加練習。