AP元素图层与行为互动应用.PDF

AP元素[圖層]與行為互動應用 11.1 互動產品說明 11.2 影像圖片按鈕式彈出選單 1.3 1 內頁框版型加上圖片按鈕式彈出選單 11.4 互動拖曳物件 11.5 互動拖曳拼圖 11.6 互動地圖瀏覽 Dreamweaver CS3 網頁設計驚嘆號 11 [ ] AP CHAPTER AP元素[圖層]在網頁編輯上的特殊性是無庸置疑的，且AP元素[圖層]與行為（JavaScript）所延伸出的 互動效果眾多（在隨後章節就會介紹）；本章先介紹行為控制版上專為AP元素[圖層]所規劃的內建行 為，以及使用內建的AP元素[圖層]行為所整合應用出的互動效果。 41 11.1 特效 藉由內建行為中的『AP元素[圖層]顯示隱藏』，整合應用在產品介紹的互動效果，由滑鼠來控制介紹 內容的顯示與隱藏，更完美呈現互動性高的產品說明。 範例效果 整合應用AP元素[圖層]顯示隱藏行為，完成滑鼠互動產品介紹。 STEP 01. 開啟「11-1.html」檔，頁面上方要來整合呈現互動的產品介紹。另外在AP元素[圖層]控制版上可以發現到 有三個隱藏的AP元素[圖層]，三個AP元素[圖層]內都插入了產品說明的內容圖，所以要來完成由滑鼠控制三 個AP元素[圖層]的互動顯示隱藏。 206 特效 41 互動產品說明 06 STEP 02. CHAPTER 確認三個AP元素[圖層]為隱藏的狀態，在畫面的 07 上、左、右三處，加上要設定互動介紹的三個影 CHAPTER 像地圖。點取上方影像地圖，按下行為控制版上 08 的『＋』→『顯示隱藏元素[圖層]』，在『元素 CHAPTER （命名的圖層）』欄位內選取要控制的元素[圖 層]Layer1，並按下『顯示』完成顯示控制設定。 09 CHAPTER 再次點取上方影像地圖，按下行為控制版上的 『＋』→『顯示隱藏元素[圖層]』，在『元素 10 CHAPTER （命名的圖層）』欄位內選取要控制的元素[圖 層]Layer1，並按下『隱藏』完成隱藏控制設定。 11