Axure RP9 页面滚动触发组件响应

原创 已于 2024-03-21 14:24:28 修改 · 799 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#axure

于 2024-03-21 14:16:05 首次发布
本文指导如何在网页中设置主页面滚动事件，当窗口滚动高度超过1480像素时触发特定动作。步骤包括新建交互、设置条件和启用情形。

一.创建一个主页面

点击主页面之外的“空白处” -> 交互 -> 新建交互 -> 窗口 向下滚动时 ,添加完“窗口 向下滚动时”事件，先不要选择动作；开始“启用情形”进入设置条件界面（如果“[[Window.scrollY]]” > "1480"）

配置完成如下所示

tongliuwei
关注
Axure RP：AxureRP元件库详解_2024-07-22_05-07-14.Tex
11-15 1157
自定义元件是Axure RP元件库的扩展功能，允许用户根据自己的需求创建和保存特定的元件。例如，如果项目中需要频繁使用一个特定样式的按钮，可以创建一个自定义按钮元件，包括其外观、交互和动态面板等属性，然后保存到自定义元件库中，以供后续使用。设计元件：在画布上设计出所需的元件，包括其外观、交互和动态面板等属性。保存元件：选择设计好的元件，右键点击，选择“保存元件到库”选项，然后选择保存到自定义元件库中。命名与分类：为自定义元件命名，并选择合适的分类，以便于管理和查找。使用自定义元件。
Axure教程-使用内联框架制作页面滚动
03-21
使用Axure 内联框架制作的页面滚动，练习用，新手可以看看，还是不错的
Axure RP9——【页面滚动操作】效果
热门推荐
两条线-twolines
11-13 1万+
页面滚动操作
axure9怎么让页面上下滑动_Axure RP 9如何制作滚动页面？
weixin_33425215的博客
01-17 1万+
Axure RP 9是一款非常方便好用的交互原型设计软件，Axure RP 9拥有全面的UI、新的设计和文档特征，算是向前迈出了一大步，拥有全新的硬件加速渲染引擎，在原来的基础上已经彻底破坏并重建了Windows版本的架构，设计了专为加速保存和加载而设计的文件结构。接下来小编要向大家介绍的是Axure RP 9制作滚动页面的具体方法，希望大家会喜欢。Axure RP 9制作滚动页面的方法：为了使效...
Axure RP 9滚动条制作
qq_56437391的博客
05-21 6309
Axure RP 9滚动条制作
Axure RP9 动态面板垂直滚动效果
m0_62866824的博客
01-22 4273
一、说明 （1）用axure做出手机上的上下滑动效果； （2）上下左右滑动交互及其方便，对C端的产品经理来说是一个不错的交互，既简单又实用； 二、教程 （1）第一步先拉一个动态面板X为375 Y为667 （2）点击进入动态面板内部放入一个X为375 Y为1000的图片，这里是为了更好的看到交互效果； （3）退出动态面板，右击动态面板点击滚动条选择垂直滚动，如要水平滑动的话可以选择水平滑动。 三、效果案例 Untitled Document ...
Axure RP 9 完全指南：从入门到精通
最新发布
这是一段简介
09-05 2754
Axure核心功能摘要 Axure是一款专业原型设计工具，主要功能包括： 基础操作：通过画布设计原型，支持页面管理、元件库调用（含自定义元件库）和样式设置 交互设计：可添加页面跳转、显示隐藏、悬停效果等交互，支持条件判断和变量设置 协作功能：原型可发布至Axure Cloud或生成HTML文件共享，支持多设备查看 文档管理：内置注释系统，可添加页面/元件说明，支持生成规范文档 高级特性：包含自适应视图、动态面板、中继器等复杂组件，支持动画效果和交互样式 典型工作流程：创建页面→添加元件→设置交互→添加注释→
精选资源
Axure-RP9培训教程PPT
02-06
### Axure RP9培训教程知识点概述 #### 一、Axure RP简介 - **软件名称**: Axure RP Pro，简称Axure RP。 - **发音**: “Ack-Sure”。 - **开发者**: 美国Axure Software Solution公司。 - **用途**: 快速原型设计...
精选资源
《AxureRP9网站与App原型设计》教学教案-04用Axure动态面板制作动态效果.docx
12-16
《AxureRP9网站与App原型设计》教学教案的核心知识点在于使用动态面板制作动态效果，这是原型设计中非常重要的一个部分。动态面板是Axure RP9中用于模拟复杂交互和动态展示的重要工具，它可以实现类似网页滚动、页面...
Axure RP9大数据可视化大屏模板与组件库
该素材基于 Axure RP9 这一主流的原型设计工具构建，充分结合了当前各行业对“数据驱动决策”和“实时可视化监控”的强烈需求，提供了涵盖医疗、教育、交通、文化、工业等多个关键领域的可视化大屏模板及通用组件库...
小白自学Axure-可滚动弹窗
weixin_50534910的博客
01-09 2275
情景：页面上点击某个按钮，出现弹窗（例如一些提示窗口或表单填写），若弹窗内容过多一屏展示不全时，需要自行滚动。对按钮增加交互状态，首先选择触发方式（单击、双击......），选择展示/隐藏（show/hide）。3、设置动态面板的滚动方式。一定不要勾选【fit to content】！1、创建弹窗，并设置为动态面板。4、将动态面板设为“隐藏”状态。5、设置交互，点击按钮弹出弹窗。
【Axure 答疑】页面滚动到一定位置显示功能按钮
11-07 1733
窗口页面是整体向上滚动的，在滚动的过程中，这个临界位置会与“回到顶部”按钮有所接触。前面的两个步骤的设置，最主要的目的是能够保证窗口页面在滚动的时候，始终有两个部件保持接触，也就是“返回顶部”按钮和定位的热区。在两个部件互相接触的时候，切换“返回顶部”的动态面板到非空白的状态，显示出按钮。两个部件未接触的时候，隐藏按钮，也就是切换“返回顶部”的动态面板到空白的状态。根据我们的实际需要，在页面滚动的时候，需要将“回到顶部”按钮保持在相对固定的位置。选择“回到顶部”按钮，单击鼠标右键，选择“转换为动态面板”
Axure长页面滚动拖动制作
SUPERCOOLIRIS的博客
03-02 1万+
关于Axure的长页面制作
Axure PR 9 锚点定位滚动 设计&交互
WGzhuiri的博客
01-04 917
3.双击动态面板，双击内联框架动态面板，下拉到段落三，选中置顶（TOP）按钮，在交互窗格点击新建交互，单击时，滚动到元件 “1”热区 垂直滚动 缓慢进入 500毫秒。9.在元件库中拖入一个内联框架，右键转为动态面板，将制作好的Banner（头图）段落内容复制粘贴到动态面板中，并删除内联框架动态面中的内联框架。2.选中段落二元件，在交互窗格点击新建交互，单击时，滚动到元件 “2”段落二 垂直滚动 缓慢进入 500毫秒，同理配置段落三。11.在元件库中拖入一个动态面板，将内联框架动态面板复制粘贴到动态面板中。
Axure 9 滚动&动态表格制作方法
weixin_53823776的博客
11-13 5046
如图虚线部分即开始滚动的部分，可按需调整效果如图：左侧表格选择的滚动方式是“按需滚动”横向和垂直都滚动，右侧列表选择的是垂直滚动。
Axure RP9 纵向滚动隐藏滚动条
jun118166的博客
11-07 9360
Axure 纵向滚动隐藏滚动条一、说明二、效果展示三、操作步骤 一、说明 纵向滚动在APP或小程序的页面中很常见的一种应用，如何实现纵向滚动隐藏滚动条呢？网上方法很多，现在就给大家介绍一种非常使用又快速操作的方法，一分钟搞定，请轻松松，so easy！！ 二、效果展示 链接案例：https://f9d9x0.axshare.com 三、操作步骤 在画布中添加375X667的矩形； 再添加一个动态面板大小为373X600； 面 ...
Axure9怎么设置横向滚动
weixin_35749796的博客
02-09 2425
在Axure 9中，可以通过以下步骤来设置横向滚动： 选择要添加滚动条的页面元素，例如一个容器。 在页面元素的"样式"面板中，找到"滚动"选项，并将"横向滚动"打开。 如果需要，可以在页面元素的"样式"面板中设置滚动条的样式。 保存页面并在预览模式中查看效果。 希望这对您有所帮助！ ...
Axure RP9——【筛选项滑动切块】
两条线-twolines
12-01 1715
筛选项滑动切块 目录 筛选项滑动切块 I.效果演示 II.实现步骤 I.效果演示 当点击界面内的任意按钮，会出现选中效果；未点击的按钮为未选中状态。 Axure rp9-筛选项滑动切块 II.实现步骤 思路： 利用【显示/隐藏】+【热区】功能实现选项滑动的效果。 注：用动态面板也可以做，原理可以参考上一篇。这里换一种做法，希望可以给你带来新思路。 1.准备元件 此例：设定3个按钮 ①标准如下： 设置等大，位置摆放好，并分别进行命...
Axure RP9 水平滑动效果制作
AMuMuion的博客
07-20 3245
Axure滑动交互
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值