锚点：页面返回顶部

案例描述
页面向下拉动时，返回按钮始终保持在页面右下位置，当单击返回按钮时，页面返回到顶部。

页面中

动态面板“FixedPanel”中

矩形RedShape放在下层

包含命名
矩形（用于滑出的红色按钮）：RedShape
矩形（用于灰色按钮）：GreyShape
热区（用于滚动位置定位）：TopWidget
动态面板（用于固定按钮位置）：FixedPanel

思路分析
①向下拉动页面时需要让“返回”按钮始终保持在右下角位置（见步骤01）
②鼠标进入“返回”按钮时，“返回”按钮变为红色，同时向左滑出红色带“顶部”文字的按钮（见步骤03~04）
③鼠标离开“返回”按钮时，“返回”按钮变为灰色，同时向右滑出红色带“顶部”文字的按钮（见步骤05~06）
④鼠标单击“返回”按钮，或滑出的“顶部”按钮时，页面回到顶部位置（见步骤07）

操作步骤
01 在元件属性中，将动态面板“FixedPanel”【固定到浏览器】为屏幕【右】侧，距离【下】方“20”像素的位置上。

02 在元件属性中为元件“GreyShape”和“RedShape”分别设置【选中】时的交互样式；

03 为动态面板“FixedPanel”添加【鼠标移入时】事件，设置动作为【选中】“当前元件”(This)；因为动态面板被选中，其中的元件都会被同步选中；所以，按钮都会呈现为红色。

04 继续上一步，添加动作【移动】元件“RedShape”【到达】位置{x} “0” {y} “0”。

05 为动态面板“FixedPanel”添加【鼠标移出时】事件，设置动作为【取消选中】“当前元件”(This)。（参考步骤03）

06 继续上一步，添加动作【移动】元件“RedShape”【到达】位置{x} “42” {y} “0”，即回到初始位置。

07 为动态面板“FixedPanel”添加【鼠标单击时】事件，设置动作为【滚动到元件】热区“TopWidget”,选择【垂直滚动】。

补充说明

• 本案例中使用了热区元件，主要是因为热区元件的透明特性比较方便做定位使用，其实也可以省略；因为案例中背景图片的位置也处于顶部，可以为其命名，然后在交互中设置滚动到该元件。
• 本案例重点讲解滚动到元件的交互；所以，除交互所涉及的元件，页面上其他元素以整张背景图片代替。

完成！