AP区块的显示与隐藏技巧.PDF

AP 區塊的顯示與隱藏技巧  網頁上的每個AP 區塊都可以設定成「隱藏」 或是「顯示」狀態，這主要是用來配合行為 ， 以設計出各項動態網頁效果  例如先讓所有的AP 區塊隱藏起來，等滑鼠移 到某個特定的地方時，再出現對應的AP 區塊 內容  也可以用來製作隱藏式選單，節省版面空間 1 AP 區塊的顯示與隱藏技巧  範例觀賞  範例實作 2 範例觀賞  請開啟完成檔Ch18-04.html  AP 區塊的顯示/隱藏應用實例 3 範例實作  要設定網頁上所有AP 區塊的隱藏/顯示狀態， 最快的方法當然是從AP 元素面板來控制  執行 『視窗/ AP 元素』命令叫出該面板後， 目前網頁裡的所有AP 區塊都會列在其中  而可以從 「眼睛」欄來設定每個AP 區塊的 顯示與否 4 範例實作 1. 請開啟練習檔Ex18-04.html ，事先在網頁中 建立了3 個AP 區塊，並分別放入圖片 5 範例實作 6 範例實作 2. 由於網頁載入後，不想先看到東京簡介 圖 片，所以要將該圖片所在的tokyo AP 區塊設 為隱藏狀態 7 範例實作 8 範例實作 3. 想讓滑鼠移到點狀 圖片上時，就顯示出原 本隱藏的東京簡介 圖片。請選取點狀 圖 層中的圖片，然後在行為面板中加入顯示隱藏 元素 9 範例實作 10 範例實作 11 範例實作 4. 回到行為面板，將滑鼠事件改成 onMouseOver ，表示當滑鼠移到點狀 圖片 上時，就會觸發設定的事件(也就是顯示 tokyo AP 區塊) 12 範例實作 5. 看起來好像設定完畢了，不過當在瀏覽器中測 試時，會發現滑鼠離開點狀 圖片後， tokyo AP 區塊並不會消失，所以必須設定當 滑鼠移開後，tokyoAP 區塊會再度自動隱藏 起來 13 範例實作  設定後請按下F12 鍵到瀏覽器中測試