Axure实现图片放大缩小操作实例

今天帮大家用axure实现图片放大缩小的效果，当你拖动图片的时候，图片也会相应的放大或者缩小，axure怎么做左右滑动图片放大缩小呢，具体步骤如下:

演示示例：https://5crdyy.axshare.com

动态效果演示：

axure实现图片放大缩小的效果

1、首先准备元件，两个文本标签分别起名字width、height（用于获取图片的宽度跟高度），一张图片（转换为动态面板）。

如图：

2、两个文本标签，分别载入时候获取图片的宽度即width、高度height，然后隐藏。

如图：

3、图片转为动态面板后，设定事件动态面板拖动时，设置图片的宽度=文本标签width+TotalDragX（这个函数的意思是：鼠标指针拖动元件从开始到结束的X轴移动距离。）设置图片的高度=文本标签height+TotalDragY（意思是：鼠标指针拖动元件从开始到结束的Y轴移动距离）。

如图：

4、继续设定动态面板事件，拖动结束时，设置文本标签width=当前图片的宽度，设置文本标签height=当前图片的高度。

如图：

总结：拖动图片改变尺寸不难，大家熟练掌握TotalDragX、TotalDragY指针函数即可。

以上就是Axure实现图片放大缩小全部内容介绍了，关于更多axure9教程信息，欢迎关注北极熊素材库，给你带来最丰富的素材图片和最有用的教程，更多最新资讯。