013. 图片热区——axure线框图部件库介绍

1. 图片热区为页面图片或者其他部件添加热区,添加交互

我们一般在做专题的时候,会遇到一些组合商品,但是又需要单独分别设置连接,如果是2张图片还好办点,可是如果和下图一样是集成在一张图片中的,可能就需要我们借用图片热区组件,给每一束鲜花添加热区,然后再设置交互,在新窗口打开链接地址。

鲜花1

我们为上面的图片添加热区,设置点击鲜花图片,单独开新的连接地址

添加热区

 

2. 图片热区作为页面锚点的使用

我们经常在有些网站看到一些楼层快速直达的链接按钮,如图:

楼层直达

其实,使用axure的页面锚点功能我们也可以制作出类似的效果

对于拖动出来的图片热区,我们必须首先给他设置标签,这样在设置交互的时候,我们才知道要滚动到哪一个锚点

设置锚点

 

如果页面没有发生相应的滚动效果,可能是你的页面设置不够长,随便放上个组件,把页面撑长。
页面够长了,点击按钮时才能体现出滚动效果。

 3. 图片热区相关属性设置

008. 认识axure部件库中各个部件的属性:http://www.heguangming.com/?p=122

4. 点击下载源文件

013. 图片热区——axure线框图部件库介绍

(本文出自萧何)

原创文章,作者:Smiler李想,如若转载,请注明出处:https://www.iamue.com/353/

(0)
Smiler李想Smiler李想
上一篇 2014-09-12 13:22
下一篇 2014-09-12 13:31

相关推荐

  • AxureRP7.0扩展元件库

    1、本元件库仅适用于Axure rp7.0以上版本; 2、本元件库已集成Axure rp7.0自带元件,避免使用中元件库的切换; 3、本元件库中所有元件均可设置,设置选项一般与元件使用说明在同一位置,使用说明一般在某个动态面板…

    2014-09-28
  • Axure rp 6.5的软件安装、汉化与注册

    第一步:从网络上下载axure安装程序到本地电脑、汉化语言包、注册码,双击安装程序,如图:

    2015-01-01
  • [Mockplus教程]重命名

    对页面和分组的重命名可以选中单个页面,然后使用F2进入名字修改状态,改完之后鼠标随便 点击其它地方即可完成修改。 对于选中页面也可以双击页面节点进入修改状态。 完整演示如下:

    Mockplus 2015-09-18
  • 002.认识Axure的软件界面

    Axure的软件界面总的来说,可以分为9大模块 1. 菜单栏:和大部分的软件界面一样,都是一些常规的文件、编辑、视图…… 2. 工具栏:是页面进行编辑的一些快捷操作,主要有字体设置、大小设置、页面显示大小和Axure本身…

    原型设计教程 2014-09-12
  • axure日常使用问题集锦,不断更新!

    1. axure生成的原型文件,如何自动隐藏sitemap和page notes 答:axure默认打开的都是index为索引的文件,我们只需要打开其他的页面文件,就可以自动隐藏sitemap和page notes 2. axure 6.5版 如何让一个部件在页面向…

    原型设计教程 2014-09-12
  • 011.矩形、占位符组件——axure线框图部件库介绍

    矩形组件和占位符没有太多的区别,这里我们主要讲解矩形组件的操作和使用,占位符的操作各位可以按照矩形的操作方法进行练习一下。 矩形组件是一个矩形,它可以用来做很多的工作,比如页面上需要一块蓝色的背景,就…

    2014-09-12
  • 『全网汇总』验证可用axure注册码|axure激活码

    我是UE网的小编:WiKi  整理出了目前市面上所有的axure激活码,学习axure的小伙伴们赶快收藏起来吧! 如发现已经过期的请联系我们进行删除,谢谢!  Axure rp pro 7.0   用户名:3ddown 激活码:FiCGEezgdGoYI…

    2015-05-29
  • 从零开始学Axure原型设计(入门篇)

    如果说Sketch是最美、最简洁的设计软件,那么Axure就是最强大的原型制作软件。Axure不仅能制作静态的视觉稿、页面,还能添加交互动作,是进行原型设计的最佳软件之一。虽然Axure的学习曲线比较陡峭,但是掌握之后可…

    2016-01-06
  • Mockplus原型交互跟我做之9–再说“链接点”

    上次我们已经对链接小圆点进行了图文并茂的说明,其实无论是跨页链接还是页内链接,在链接创建好了之后,选中按钮,当你把鼠标移动到小圆点的时候,它会自动指示链接目标(链接到的页面或者组件),请参考如下演示…

    2016-07-07
  • Axure教程:如何学习AxureRP Axure学习方法

    【编者按】本文作者@朱军华Ronzhu , 本文借用官网的描述定义,介绍了在学习AxureRP过程当中所要经历的各个阶段,也结合了作者自身学习AxureRP使用的经验,讲一下在各个阶段中的一些学习方法和经验总结,以帮助刚开始学习使用AxureRP的朋友更好的制定自己的学习计划,以便尽早掌握其使用方法,设计出中高保真度的原型。

    2015-01-01