嘿,大家好,今天教大家如何在Axure中实现轮播图的效果,废话不多说,直接进入正题。
首先建立一个动态面板,如果有5个图片的话则建立5个状态,每个状态插入一张图片:
然后在动态面板下放置5个圆点并将其组合起来,再将动态面板与之再组合起来:
在首页添加事件实现页面一加载完就自动轮播的效果:
然后在banner组合上添加事件,实现鼠标移入时暂停,移出时继续轮播的效果:
给每一个圆点添加点击时填充黑色的交互事件,同时默认第一个被点击。
为了实现点击圆点切换对应的图片的效果,需要给每一个圆点添加点击事件:
对应的圆点为true,其他为false。同时选中对应的图片
但是仅仅这样还不够,如果图片自动轮播的话,对应的圆点不会被填充,那我们该如何实现呢?需要给动态面板添加事件:
同理,依次改变。
这样就可以实现啦!是不是很简单,还不快动手试试!!
网友评论