Axure Promotion · Axure Tips · Axure Tutorial · Elementary · Interactions · Learn axure · Pages · Jul 12, 2022

Axure Tutorial: Add Interactions to Page

by WELLJOE

Introduction

This article is a section of course Axure Full Course: Tutorial, Tips and Templates.

A template for page interactions will be attached at the end of the tutorial, you can also preview it here.

Add Interactions to page

Click the blank of the page, and the New Interaction button will be shown on the Interactions pane on the right. Click this button to add interactions to the page.

Next we will introduce each event trigger:

Event List

Mouse:
Page Click or Tap: Triggered by clicking on the page, it can be used to close the context menu, hide the mask, etc.

Page Double Click or Double Tap: Double click the page to trigger. Double click is often used in apps.
Page Context Menu (Right Click): It can be triggered by right clicking on the page. It is often used in applications and rarely used on website.

Page Mouse Move: It can be triggered when the mouse moves on the page, which is often used to make the effect of menus or panels following the mouse.

Keyboard:

Page Key Down: Triggered when a key is down on the page. It is generally used in combination with case to perform some actions when a key is pressed.For example, press enter to enter the next page.

Page Key Up: Triggered when a key is up on the page. It is generally used in combination with case to perform some actions when a key is pressed.

Page:

Window Resized: Triggered when the page size changes. It is a very common event trigger. Often used to make responsive views.

Page Loaded: Triggered when a page is loaded, it is often used to perform automated operations.

Adaptive View Changed: Used in conjunction with responsive views, it is often used to change certain elements in response to changes in the view.

Window Scrolled Up: Triggered when the window scrolls up. It is often used to show or hide certain elements.
Window Scrolled Down: Triggered when the window scrolls down. It is often used to show or hide certain elements.

Window Scrolled: Triggered when the window scrolls down. It is often used to show or hide certain elements or change the value of certain elements.

Cases, Interactions and Actions

About Cases, Interactions and Actions, there is a detailed introduction in the article Axure Tutorial: Add Interactions to Widget, because the basic principles of interaction between pages and widgets are the same, so please check the above article.

That's all for today's lesson, next lesson we'll learn how to add notes to pages.

If you have any questions and suggestions, please leave a message.

If you like the article, please share it with others with page link, thanks for your supporting! ❤

Note: Click here to download the completed RP file for this tutorial (RP 10 or up).

Well Joe @AxureBoutique, a technology writer and teacher, focuses on Axure prototype design and product design.