Axure网页怎么设置横向标签页效果?

Axure想要制作横向标签页效果,该怎么制作横向标签页呢?下面我们就来看看详细的教程。

软件名称:
Axure RP v8.1.0.3382 Enterprise 中文特别版(附注册机+汉化包+安装教程)
软件大小:
83.2MB
更新时间:
2019-04-26

1、打开Axure,今天教大家使用Axure制作横向标签页效果,如下图所示。

Axure网页怎么设置横向标签页效果?_第1张图片

2、首先我们准备本次要使用的元件,从元件库中拖入到工作台中,如下图所示。

Axure网页怎么设置横向标签页效果?_第2张图片

3、然后我们通过调整矩形的大小及样式,制作出如下图所示的效果,并对每一个按钮进行命名,如下图所示。

Axure网页怎么设置横向标签页效果?_第3张图片

4、然后我们在通过动态面板建立一个展示内容的区域,并复制出三个State状态,如下图所示。

Axure网页怎么设置横向标签页效果?_第4张图片

Axure网页怎么设置横向标签页效果?_第5张图片

5、下面开始给每一个按钮加一些交互效果,比如鼠标悬停效果及选中效果等,如下图所示。

Axure网页怎么设置横向标签页效果?_第6张图片

6、最后我们再给每一个按钮加入交互事件,当鼠标单击时,切换动画面板的状态页,如下图所示。

Axure网页怎么设置横向标签页效果?_第7张图片

Axure网页怎么设置横向标签页效果?_第8张图片

7、最后我们F5预览一下效果,点击各个选项卡的按钮,下面的显示内容会进行变化,如下图所示。

Axure网页怎么设置横向标签页效果?_第9张图片

Axure网页怎么设置横向标签页效果?_第10张图片

以上就是Axure设置横向标签页效果的教程,希望大家喜欢,请继续关注脚本之家。

相关推荐

Axure怎么制作一个水平拖动的效果?

Axure怎么修改默认的单选复选框按钮样式?

axure怎么添加滚动条? axure水平垂直滚动条的设置方法

你可能感兴趣的:(Axure网页怎么设置横向标签页效果?)