用dHTMLOutlines插件設計網站建設三級及以上目錄菜單

在實際網頁制作過程中,經常會遇到比較復雜的菜單,即多級菜單,有三級以上的目錄,制作較二級目錄菜單復雜些,下面以《皮膚病性病學》網絡課件為例說明菜單的制作方法。

1　步驟1　首先在對話框內填入一級目錄標題。

2　步驟2　本例的菜單中,“前言”只有一級目錄,“總論”有二級目錄,“各論”有三級目錄。對于只有一級目錄的“前言”,只要刪掉其下的子目錄即可。對于有二級目錄的“總論”,只需要將其下級的文字換成二級目錄標題即可,步驟同2. 2. 3和2. 2.4。由于“各論”有三級目錄,操作較復雜,需要先將其下面的子目錄刪掉,光標停留在原處,然后再次單擊菜單Insert(插入)>Outlines,打開參數設置對話框,在“Add Heading”框鍵入“各論”的下一級標題,即二級目錄標題,點擊“+”后即可加入。

3　步驟3　再將二級目錄的下級目錄的文字“Replace the contentof thisdivwith the contentwhichyouwish to havewithin the outline”換成三級目錄的標題,在各三級目錄標題之間按<Shift>+<Enter>鍵進行換行,即可完成菜單的制作。

4　步驟4　如果菜單的層次超過三級,仍按上述方法,將文字“Replace the content of this div withthe contentwhich youwish to havewithin the outline”刪掉后再次單擊菜單Insert(插入)>Outlines進行操作,依此類推。

在實際操作過程中,我們可以在不同級別標題前加上不同的小圖標,以示區別標題的級別,也可把各級標題文字做成圖片形式,這樣效果會更好。制作完成的具有三級目錄的樹狀結構菜單。

　　通過上面的幾步操作,我們非常方便地設計出了類似于Windows的資源管理器中的樹狀結構菜單,單擊任何一個目錄可打開或關閉其下級的子目錄,同時也打開相應的網頁。有關網站制作中用于設計菜單的插件還有其他一些,本文僅介紹其中操作簡便、效果最佳的dHTML Outlines插件,供大家在制作網絡課件的菜單時參考。