起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識Axure 教程：頂部導航欄
當鼠標移入菜單時顯示子菜單，當鼠標移出時子菜單自動隱藏，這樣的交互在制作原型時相信會經常用到的一種交互。
如下圖：
頂部導航欄（鼠標移入顯示子欄目，移出隱藏）
線上效果圖，查看：頂部導航欄（鼠標移入顯示，移出隱藏）
制定方法
1. 菜單制作
制作頂部菜單，使用基本元件：文本標簽創建標題，設置標題大小并設置行間距。
菜單制作
2. 子菜單制作
制作子菜單，使用基本元件：動態面板，并設置動態面板名稱，進入動態面板。
子菜單制作
進入動態面板添加子菜單名稱，可針對每個子菜單添加交互，如跳轉鏈接，鼠標移上去字段交互等。
子菜單制作
3. 菜單交互
回到index頁面，針對一級菜單添加交互，當鼠標移入時顯示菜單一并向下滑動，時間動畫300s。
一級菜單交互
針對二級菜單添加交互，當鼠標移出時隱藏菜單一并向上滑動，時間動畫300s。
子菜單交互
4. 熱區添加
在菜單邊加上熱區交互，即可實現上述效果。
熱區交互
本文由 @五百英里 原創發布于人人都是產品經理。未經許可，禁止轉載
題圖來自Unsplash，基于CC0協議
評論
可以分享下源文件嗎？
直接用水平菜單就能解決吧？
實現有方式有多種，這只是其中一種