实现手机站侧边导航、幻灯片——Axure8.0

效果图.png

手机站侧边导航(设定屏幕可显示宽度为640px)

1.将矩形元件设置宽度为640,高度任意,然后再设计顶部栏目以及相关内容,如下图:

顶部设计.png


2.设计侧边栏,如下图所示,然后将侧边栏及其内容转换为动态面板且设置为隐藏状态

侧边栏设计.png



3.给按钮设置点击事件。添加动作“显示/隐藏”,选择可见性为切换

事件添加.png

手机站幻灯片

1.在上述的基础上添加矩形以及小圆点,选中幻灯片所有内容转换为动态面板,给动态面板设置三种状态,对应三张幻灯片

幻灯片设计.png


2.进入面板状态1,设置圆点选中状态,复制状态1到状态2、状态3并改变选中圆点。回到主页面,设置页面载入时的事件,添加“等待”动作》添加“设置面板状态”动作,设置为状态2》添加等待》设置面板状态为3》等待》设置面板状态为1

幻灯片面板状态设计.png

3.最后,要注意将侧边导航栏的动态面板置于顶层,防止轮播图遮挡侧边导航

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容