手机
当前位置:查字典教程网 >电脑 >工具软件教程 >如何制作Axure教程下拉菜单
如何制作Axure教程下拉菜单
摘要:一、首先用矩形工具画一个背景,当然,你用图片来做背景也行,无所谓,这个只是一个修饰作用,表示这块是一个菜单。二、再画一个没有颜色和边框的矩形...

一、首先用矩形工具画一个背景,当然,你用图片来做背景也行,无所谓,这个只是一个修饰作用,表示这块是一个菜单。

如何制作Axure教程下拉菜单1二、再画一个没有颜色和边框的矩形,这里先不说明这个矩形的作用,但一定是有用的(这不废话么)。矩形的宽要比整个菜单两边都宽一些,高要比下拉出来最长的菜单高一些。然后把这个矩形锁定住,快捷键是Ctrl+K,以免下面的误操作这个“看不见的矩形”了。

如何制作Axure教程下拉菜单2三、在合适的位置写上一级菜单内容。

如何制作Axure教程下拉菜单3四、在刚刚写的一级菜单内容上面加一个动态面板,双击此动态面板,修改此动态面板的标签和状态名字。

如何制作Axure教程下拉菜单4五、接着选择刚刚修改的面板状态,点击右侧的编辑状态按钮,进入编辑面板状态区域,在这里画上下拉菜单被激活的状态,也就是二级菜单,注意,一级菜单的内容也要画进去。这个面板的内容其实就是鼠标移动到一级菜单上之后显示的内容。

如何制作Axure教程下拉菜单5六、回到home页面,之后有几个步骤如下:

1、调整动态面板的位置,使之和后面的一级菜单的内容相重合,也可以在上一步编辑动态面板状态中调整一级菜单的位置;

2、右键点击动态面板,编辑动态面板–设为隐藏,让二级菜单默认隐藏;

3、复制动态面板和一级菜单,分别放至合适的位置(要同时选中动态面板和一级菜单进行复制);

4、对复制后的动态面板进行重命名,便于以后进行识别;

如何制作Axure教程下拉菜单6七、选中第一个一级菜单的内容,然后打开“注解和交互”的操作面板,在“OnMouseEnter”上点右键,添加事件;“OnMouseEnter”其实就是指当鼠标移动到这里时,激活某些事件。

如何制作Axure教程下拉菜单7八、之后我们会看到一个“交互事件属性”对话框,因为前面第六步的第2小步,我们已经把动态面板隐藏了,那么,这里,我们需要把他显示出来。选中“显示动态面板”,之后点击下面“Show Panel”的Panel来进行选择面板,选择需要显示的动态面板,点确定。

如何制作Axure教程下拉菜单8九、重复七、八步骤,分别应用到其他一级菜单中。

如何制作Axure教程下拉菜单9十、最后一步很重要,回忆一下第二步我们是不是画了一个没有颜色和边框的矩形,用处在这里,选中它,并解锁(Ctrl+Shift+K)。之后还是给他添加“OnMouseEnter”事件,这次不是要显示动态面板了,而是要隐藏动态面板,并且选中所有的动态面板。意义就是当鼠标离开动态面板的范围,移动到这个没有颜色和边框的矩形范围内,

如何制作Axure教程下拉菜单10隐藏动态面板。如果没有这一步,鼠标移动到其他位置的时候,这个二级菜单是不会隐藏的。

【如何制作Axure教程下拉菜单】相关文章:

钉钉如何删除群成员?

如何判断U盘是否中毒

钉钉如何创建新的日志模板?

教你如何恢复相机已删除的相片

钉钉如何发红包?

5分钟用AE制作揉纸团效果

迅雷7如何更改下载目录?

网开云办公如何工作派发

硕鼠如何一次批量解析多个视频

网开云办公如何修改企业名称

精品推荐
分类导航