續(xù)：《一天上手Axure RP (2.1) Web案例》瘫拣，《一天上手Axure RP (2.2) Web案例》陕赃。
Web案例的最后一階段省艳，相對要復(fù)雜些。不過不要擔(dān)心回铛，相信自己狗准，稍微思考下就能理解。
STEP 1 . 準(zhǔn)備內(nèi)容
因為內(nèi)容較多茵肃，這就不一一講如何添加的了腔长，相信看了前面操作的同學(xué)能輕松搞定。這次我們稍微把內(nèi)容排多一些验残，這樣才能有Y滾動效果捞附。最后效果如圖：
當(dāng)然，內(nèi)容可以再多些您没。
STEP 2 . 固定導(dǎo)航欄
分析：當(dāng)頁面往下滑動時鸟召，導(dǎo)航欄會離開我們的視野。這并不是我們想要的氨鹏，我們希望它一直固定到頂部欧募。由此可見，觸發(fā)事件應(yīng)該是頁面滾動仆抵，然后來改變導(dǎo)航欄的坐標(biāo)位置跟继，讓它一直在頂部(y=0)。
1. 將要固定的導(dǎo)航欄肢础，整塊轉(zhuǎn)為動態(tài)面板还栓。
2. 我們需要監(jiān)聽頁面(Page)的"OnWindowScroll"事件。當(dāng)往下滑動超出(大于)導(dǎo)航距離最頂部的距離時(y=44)传轰，導(dǎo)航的y值就要等于滑動的垂直距離，這樣就可以保持導(dǎo)航一直出現(xiàn)在瀏覽器的頂部谷婆。
y設(shè)定的值是"[[Window.scrollY]]"慨蛙，那么這個"[[Window.scrollY]]"是從哪來的呢辽聊？
在值文本框后面有個"fx"的按鈕，點擊后可以看見一個值編輯頁面期贫。在這里跟匆，我們可以調(diào)用一些Axure為我們提供的[變量]或[方法]⊥常可以看見我們這用到的Window.scrollY變量玛臂。（在視頻中，我們有講到如何直觀的去查看這些值）
3. 當(dāng)scrollY不大于44的時候封孙，我們應(yīng)該把導(dǎo)航放回原位迹冤。
STEP 3 . 播放外部視頻
這里我們使用"Inline Frame"組件，來鏈接到外部視頻/網(wǎng)站虎忌，顯示在我們原型中泡徙。
我們將鏈接設(shè)置其中：
把它轉(zhuǎn)為動態(tài)面板，并固定在瀏覽器中央膜蠢。
"Set Hidden"堪藐，在頁面加載完后顯示，以模態(tài)形式挑围。我們需要Page的"OnPageLoad"事件礁竞。
這樣，在進入該頁面時就會自動顯示視頻并播放杉辙。點擊周圍任意空白處則隱藏視頻苏章。
這樣，Web案例就算完畢了奏瞬。感覺怎么樣枫绅？歡迎通過任何方式給我反饋喲。
看視頻可以看到硼端，更多內(nèi)容并淋，更細(xì)節(jié)的操作喲。
工具能表現(xiàn)你的思考結(jié)果珍昨，甚至過程县耽，過分依賴工具則會束縛你的思維。
