美文网首页
Axure-动态面板2(多个页签、固定浏览器)

Axure-动态面板2(多个页签、固定浏览器)

作者: 晴天的歌 | 来源:发表于2020-04-09 11:26 被阅读0次

上次介绍了动态面板的图片轮播功能,这次根据本人实际工作中碰到应用介绍下动态面板的其他应用。如下:

1.多个页签的切换效果

2.固定内容到浏览器的特殊位置。

同样,先看下效果

好,下面就说明下怎么制作

多个页签的切换效果

1. 首先在区域内增加动态面板,双击进入,定义三个状态的为,基础资料、商品条码、操作记录。

分别双击3个状态进入之后,单独编辑每个状态的页面效果。


2. 添加每个页面的页签,用来标识当前页签的业务信息和操作交互的操作区域。

如下,新增3个按钮,并命名各自名称

3.调整好按钮的背景色和字体颜色。同时选择3个按钮,右键选择交互样式,调整选中时的填充颜色。

4. 设置动态面板初始的状态, 意思就是进入到动态肩膀之后首先展示的内容。 添加载入时事件,设置面板状态为基础资料。设置选中状态,初次进入时基础资料按钮为选中状态。 

shei

5. 设置3个按钮的单击事件,用来切换面板。添加单击事件,设置面板状态,依次设置3个按钮对应的面板。 

设置面板状态改变是事件,当面板的状态为基础资料时,设置基础按钮为选中状态,同理设置其他两个面板状态时对应的按钮选中状态。 

OK, 多个页签的功能介绍完成, 下面介绍固定浏览器的功能。

固定元素到浏览器特定位置

动态面板提供了一个功能,把元素固定到浏览器的固定位置。 多用在系统或者网页的顶部或者左侧区域。 

1. 首先设置元素为动态面板, 选中之后邮件直接转换成动态面板,


2. 然后选择动态面板设置固定到浏览器

总结:结合我的上篇文章,动态的面板的主要功能就结束了。希望可以帮助大家练习使用动态面板。


相关文章

  • Axure-动态面板2(多个页签、固定浏览器)

    上次介绍了动态面板的图片轮播功能,这次根据本人实际工作中碰到应用介绍下动态面板的其他应用。如下: 1.多个页签的切...

  • 原型设计(动态面板)

    动态面板比喻成相册,其特点: 1、只有动态面板才有推动,推拉效果 2、其有固定浏览器功能

  • 动态面板学习

    1、自适应内容 2、滚动条 3、固定浏览器 4、100%宽度 5、动态面板滑动列表

  • sessionStorage

    只在当前存储的页签生效,浏览器打开多个页签,其他页签是获取不到session的内容的

  • Axure实例——主流登录/注册原型

    1.设置动态面板: 首页 注册/登录页 密码登录页 成功页 试用页 2.首页(动态面板状态:shouye): 登陆...

  • 淘宝页签切换效果

    淘宝页签的切换效果包括动态面板、热区的应用。 【效果图】 【思路分析】 利用动态面板状态的切换实现快速登录与账号密...

  • Axure交互笔记(持续更新)

    1. 把模块固定在页面上 1)模块转换成动态面板 2)属性-滚动条 -无 3)属性-固定到浏览器,设置位置。?啦!...

  • AXURE-动态面板练习

    什么是动态面板? 动态面板是Axure中使用频率最高的元件之一,动态面板专门用于设计原型中的动态功能,它可以包含一...

  • Vue多标签页应用解决方案

    业务场景 应用系统中需要运用到多标签页,跟浏览器一样的效果,在新打开页面后,动态追加一个页签,点击页签可以切换系统...

  • 技术选型

    2、前端 动态页签:Jerichotab,jquery-1.12.4.min.jsCSS框架:element-ui...

网友评论

      本文标题:Axure-动态面板2(多个页签、固定浏览器)

      本文链接:https://www.haomeiwen.com/subject/wpptmhtx.html