起點課堂會員權(quán)益
職業(yè)體系課特權(quán)
線下行業(yè)大會特權(quán)
個人IP打造特權(quán)
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導(dǎo)直播
12場專業(yè)技能直播
會員專屬社群
榮耀標(biāo)識Axure教程：頂部導(dǎo)航光標(biāo)定位
當(dāng)鼠標(biāo)移入頂部菜單時，菜單頂部有光標(biāo)跟隨，當(dāng)移出時，光標(biāo)自動回到當(dāng)前頁面菜單位置。這種效果應(yīng)該怎么實現(xiàn)呢？
如下圖：
頂部導(dǎo)航光標(biāo)定位
線上效果圖，查看：頂部導(dǎo)航光標(biāo)定位
制件方法
1. 頁面與導(dǎo)航欄制作
按平時制作導(dǎo)航與頁面的方式制定，先制作好頁面與導(dǎo)航欄。
2. 菜單動態(tài)面板
添加動態(tài)面板，放在導(dǎo)航欄位置。
菜單動態(tài)面板
3. 制作菜單
進(jìn)入動態(tài)面板，添加4個菜單，并添加光標(biāo)，并放置于菜單一位置。
菜單制作
4. 菜單一交互
針對每個菜單單獨做交互效果，菜單一交互設(shè)置。
菜單一交互
在菜單一的交互中添加全局變量”blue”，并設(shè)置值為“菜單一”。
變量值設(shè)置
5. 菜單二交互
菜單二交互設(shè)置：
菜單二交互
在菜單二的交互中添加全局變量“blue”，并設(shè)置值為“菜單二”。
變量值設(shè)置
其余菜單按以上方法進(jìn)行設(shè)置。
6. 動態(tài)面板頁面交互
在動態(tài)面板頁面做鼠標(biāo)移出時的交互效果：
鼠標(biāo)移出交互
7. 母板
多個菜單頁面，可將制作的菜單轉(zhuǎn)換為母板，其余3個菜單頁面可直接使用。
母板
8. 主頁面交互設(shè)置
在主頁面設(shè)置頁面載入時的交互：
頁面載入設(shè)置
本文由 @?五百英里 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載
題圖來自Unsplash，基于CC0協(xié)議
評論
- 目前還沒評論，等你發(fā)揮！
