如何使用Axure:[7]制作弹出窗口Modal

当我们制作网站模型时,很容易就会遇到弹出窗口,一般情况下,在前端框架中,这种效果叫Modal。

准备

  • 01

    打开Axure,创建一个新的RP文件

  • 02

    拖入一个矩形,用于触发Modal弹出

  • 03

    拖入一个矩形,并转换为动态面板,并命名为ModalPane

  • 04

    进入ModalPane的状态state1中,设置已经存在的矩形的边框为「无边框」,设置其背景色为灰色,透明度为30%

  • 05

    添加一个矩形,作为弹出Modal,将其转换为动态面板

  • 06

    进入到Modal的状态编辑界面,并绘制Modal的内容

添加事件

  • 01

    在Modal动态面板中,为关闭按钮添加关闭事件

  • 02

    设置ModalPane的可见属性为隐藏

  • 03

    为「触发」按钮添加显示ModalPane的事件

    完成

    • 01

      按F5进行预览

    (0)

    相关推荐

    • 如何利用ppt中触发器制作弹出窗口动画

      利用ppt制作弹出窗口动画,主要利用了触发器功能,现在就分享制作过程和截图,希望对你有所帮助. 操作方法 01 首先启动ppt2010,执行插入-图片命令,插入一张风景图片. 02 执行插入-文本框命 ...

    • Axure RP如何制作弹出窗口

      在使用Axure RP制作网站原型的过程中,很多时候会遇到弹出窗口的情况,一般情况下这种弹出的窗口叫做Modal,在RP中是利用动态面板来实现该功能.在使用RP工具的过程中,我们该如何实现这种效果呢? ...

    • axure怎么制作弹出框效果?

      网上看的一些axure弹出框教程不是很详细,照着做也 做不出来弹窗效果.所以自己做了一个新手可以看懂的最基础的弹出并关闭窗口的教学. AXURE弹出框 弹出的步骤 1.新建一个动态面板 2.双击动摇面 ...

    • Axure RP怎么制作弹出菜单的效果?

      Axure设计的网页中想要制作一个弹出菜单,就是当鼠标移入头像的时候,出现下拉菜单,用户可以进行相应的操作,比如百度的首页效果一样,当移到“更多产品”的时候,就出现了其他的菜单选项,该怎么制作呢?下面 ...

    • 如何制作抖音上的恶搞弹出窗口

      抖音上看到很火的恶搞弹出窗口是怎么做出来的呢?方法很简单,下面一起来看看吧.具体如下:1. 第一步,我们先打开电脑,右键点击桌面空白处,然后选择新建一个txt的空白文档,如下图:2. 接下来,双击打开 ...

    • 浏览器阻止(禁止)弹出窗口设置教程

      在使用浏览器上网的时候有没有经常碰到弹出窗口,觉得很麻烦吧,其实浏览器是有阻止弹出窗口的功能的,在这里让我们来看看怎么设置吧! Internet Explorer 8 (简称 IE8)是为全世界所广泛 ...

    • 弹出窗口文字复制方法

      我们在上网或使用电脑时常会碰到一些弹出警告窗口,但是弹出窗口中的文字一般都无法复制下来,如果遇到系统弹出窗口报错,我们一般都会上网查原因,这时我们就需要一个字一个字输入非常麻烦,那有什么好的方法吗? ...

    • QQ浏览器屏蔽弹出窗口在哪里

      屏蔽弹出窗口是一个默认打开的功能,当在访问一些有弹窗功能的网站时,QQ浏览器会将弹出的页面自动截。每当拦截一个页面,右下角会出现对应的显示,如:,数字表示当前拦截的窗口数。 如果您需要查看拦截的页面, ...

    • 如何阻止弹出窗口浏览器设置攻略

      在日常使用电脑的过程中,弹出窗口是我们经常遇到,一些是对应我们的操作必须出现的,而有些则是被动接受的。尤其是各种广告窗口更是无孔不入,防不胜防,这些弹出窗口严重影响了电脑的正常使用,甚至会造成电脑出现 ...