
小楼axure 图文教程(八)带遮罩层的弹出框.docx
- 1.请仔细阅读文档,确保文档完整性,对于不预览、不比对内容而直接下载带来的问题本站不予受理。
- 2.下载的文档,不会出现我们的网址水印。
- 3、该文档所得收入(下载+内容+预览)归上传者、原创作者;如果您是本文档原作者,请点此认领!既往收益都归您。
最后一页预览完了!喜欢就下载吧,查找使用更方便
10 文币 0人已下载
下载 | 加入VIP,免费下载 |
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 小楼axure 图文教程(八)带遮罩层的弹出框.docx
- 资源描述:
-
1、小楼 axure 图文教程(八)带遮罩层的弹出框作者: 小楼一夜听春语 分类: Axure 教程 发布时间: 2013-07-12 22:58 6 没有评论 编辑本文出自 诉客 -产品经理的心声,转载时请注明出处及相应链接。示例原型下载: 小楼 Axure 原创元件-带遮罩层的弹出框实现目标:1、 点击按钮弹出带遮罩层的对话框;2、 页面上下左右滚动时,弹出的对话框水平和垂直始终居中。实现步骤如下:1、 拖入编辑区 2 个矩形,并点右键转换转换为动态面板;2、 双击其中一个动态面板设置标签为“遮罩层”(看个人喜好随便命名),并双击状态 1 进入编辑;3、 点击状态 1 里面的矩形,设置大小与网
2、站页面大小相同,以便完全遮盖;然后,设置矩形边框为“无”;最后设置填充色的透明度为 50%(看个人喜好),并选择填充色为灰色(看个人喜好);4、 关闭状态 1 编辑页面,选择另外一个动态面板,按照第 2 步命名并进入编辑;5、 设置里面的矩形为合适大小,并拖入一个按钮(或者矩形/文本面板)作为关闭按钮;设置按钮 onclick 事件为隐藏遮罩层和当前编辑的这个动态面板;6、 关闭当前的编辑页面,再次选择作为对话框的这个面板 右键编辑选项固定到浏览器;7、勾选固定到浏览器窗口,水平和垂直都选择居中,并勾选“保持在前面”;8、 拖入一个按钮(或者矩形/文本面板)到编辑区,双击输入文字“登录”;然后点右键顺序置于底层;9、 按着 ctrl 选择两个动态面板(或者挨个设置),点右键编辑选项设为隐藏。10、 好了,生成原型就能看到效果了。扩展:固定到浏览器选项可以让动态面板无论页面怎么滚动,总是停留在一个位置,那么网站两侧的对联广告,或者浮在页面上的一些按钮、图片等,都能用这种方式来实现。
