图像热区的功能二：作为锚点使用

尹广磊

学习目标：

学习图像热区的功能二：作为页面锚点使用。
图像热区可以作为页面锚点使用，可以通过交互动作设置让页面窗口滚动到锚点所在位置。


演示效果：

解压后点击其中的start.html页面，点击按钮窗口会滚动条矩形所在位置。

滚动到锚点.rar (323.07 KB, 下载次数: 1739)

2015-3-12 14:06 上传

点击文件名下载附件

教程开始：

照下图，绘制一个基本图形，然后拖入图像热区到指定位置，并在名称处给热区命名。




见下图，选中按钮，点击“新增用例”，准备在按钮上添加交互动作。




见下图，弹出的是交互动作的设置面板，
左侧是可选择的交互动作，中间是已选择的交互动作，右侧是交互动作的功能设置。
照下图指示的顺序，进行相应的设置。动作含义是点击按钮可以让窗口滚动到锚点位置。




提示：在上图2处，一个闪电符号表示一个交互动作，
可以继续点击左侧的动作选项来添加多个动作，在中间动作上右键可以选择删除或上移、下移。

提示：上图2处的“用例1”表达是一个交互动作序列，它可以由下面一个或多个交互动作来构成。
含义是点击页面中的按钮一下，就会按着顺序执行该“用例1”中的交互动作。

提示：上图3处，可以隐藏掉页面中那些未命名的控件，方便找出自己已经命名的控件。
像该示例中的图像热区这样，以后所有“被找到”或“被控制”的控件都要在名称处给控件命名。
只有通过命了名，才能在交互面板处通过名子区分出它们来。


照常理，交互动作已经设置完成，
只是本示例为了看得出演示效果需要保证页面够长，页面要能够向上滚动才可以。
因此照下图，需要在页面偏下的位置随便放点控件，好让生成的页面足够长。




示例文件：

蔡炜炜

学会啦

chancy

很实用

Hiu

为什么我点击滚动下方就变成了往上走啦

mathlogic

学习热区作为锚点使用