青銅修煉手冊:Axure回到頂部互動設計
阿新 • • 發佈:2018-11-15
“回到頂部”這個互動我們經常在瀏覽網站的時候遇到,所以今天想分享一下這個互動是如何實現的
步驟:
(1)首先我們在畫布放置一個灰色矩形和一個內聯框架,矩形內填寫文字“網頁首部”
(2)新增一個內容頁面,在裡面隨意新增內容,內容的高度要高於內聯框架的高度,在這裡我隨意添加了幾個矩形
(3)點選內聯框架連結到【內容頁面】
(4)放置一條水平線在y軸為“0”的地方,並取名為“頂部”
(5)放置一個50*50的動態面板在畫布中並取名為“回到頂部”,然後在動態面板State1狀態中新增一個50*50的【灰色】箭頭
(6)點選“回到頂部”並右鍵選單選固定到瀏覽器,在出來的彈框上選擇“水平固定”為【右】15,“垂直固定”為【下】15
(7)為“回到頂部”新增互動方式,點選【滑鼠點選時】->【滾動到元件<錨鏈接>】->【頂部(水平線)】->【僅垂直滾動】->【動畫“線性”500毫秒】
(8)完成,點選瀏覽檢視效果
原型檢視效果地址:
原型RP檔案下載地址:https://download.csdn.net/download/qq_27884377/10633782