欢迎来到天天文库
浏览记录
ID:29803833
大小:698.00 KB
页数:4页
时间:2018-12-23
《Axure8.0|动态面板内容简单切换技巧.doc》由会员上传分享,免费在线阅读,更多相关内容在学术论文-天天文库。
1、Axure8.0|动态面板内容简单切换技巧 无论做web段还是移动端,常常会用到动态面板固定在某个区域来变换内容,达到节省空间的作用,今天分享的就是如何实现这种方式。 预览效果: 一、元件准备 以IT/互联网、设计创作、职场金融这三组为例,所涉及到的元件分别为it1(小竖条矩形)、it(标识”IT/互联网”矩形)、design1(小竖条矩形)、design(标识“设计创作”矩形)、finance1(小竖条矩形)、finance(标识“职场/金融”矩形)以及最后的动态面板neirong(分为三组,名称分别对应it、des
2、ign、finance)。 注:小竖条矩形默认颜色是灰色的,这里填充颜色只是为了看清楚。 二、添加事件 1,将三个小竖条矩形设置选项组,名称为“标记”,并且分别添加选中事件:填充颜色#2CC27B。 2,将三个矩形设置选项组,名称为“课程”,并且分别添加选中事件:填充颜色白色。 释:这里设置选项组的目的是为了当点击其中一个为选中时,其他两个就会变为不选中。 3,鼠标单击“it(IT/互联网)”设置动态面板neirong,选择状态Value,状态名称[[this.name]]; 选中it1和it。 将it的鼠
3、标单击事件复制然后粘贴到“desgin(艺术设计)”、finance(职业/金融),且分别将选中对应改为design1和design、finance1和finance。 4,针对上下拖动动态面板而不超出框架这一实现方式可以参考上一期的Axure8.0|移动端上下滑动不出屏。 三、效果 具体效果请点击右侧网址http://67r9k4.axshare.com/#g=1&p=index。
此文档下载收益归作者所有