高级 Axure教程：跟随鼠标方向的面板滑动动画 _鼠标

本教程主要是运用【全局变量】获取鼠标坐标参数以及【函数】来判断鼠标入点的方向。
当鼠标从元件A的【上、下、左、右】方向移入时，则元件B从对应方向滑进。当鼠标从其它方向移出时，则跟随一起移出，效果如下：
一、页面布局

文章插图
从左侧元件库拉入一个【热区】作为鼠标触发区域，一个【矩形】作为描述B和一张【图片A】，宽高尺寸都设置为一样，居中对齐，如下：
其次，将【描述B】设置为隐藏。
二、添加全局变量

文章插图
点击顶部导航【项目】-》【全局变量】，添加两个变量，分别为【】和【】，主要是为了作为后面获取鼠标的坐标参数。
三、添加交互
1、选中【热区】，添加【鼠标移入时】事件。
【高级Axure教程：跟随鼠标方向的面板滑动动画】2、选择左侧【全局变量】-》【设置变量值】，勾选变量【】和【】，设置值分别为鼠标的坐标X轴【.x】和Y轴