本章介绍如何使用指针函数实现鼠标区域的商品的放大,广泛应用于商品细节展示。
案例简介:
鼠标进入商品图标时,商品图标呈现选中状态,同时商品图片相应改变;鼠标进入商品图片时,有绿色半透明矩形跟随鼠标移动,但是不超出商品图片范围;同时,右侧出现绿色半透明矩形所覆盖区域的放大图片;鼠标离开图片时,绿色半透明矩形放大图片消失。
案例实际效果:
原件命名:
- 图片(用于商品图片):GoodsImage
- 图片(用于放大图片):LargeImage
- 图片(用于商品图片):Areapanel
- 图片(用于商品图片):ZoomInPanel
以下是详细教程,请大家慢慢食用。
Axure RP 8 教程-指针函数之商品图片放大
1.将元件库的图像拖入到工作台,将其命名为GoodsImage,尺寸设定为(w:400 H:400)