Knowledge Base

Scrolling Actions

Scrolling actions can be applied to practically element, the typical use of this is to jump to a piece of content further down the page. For example, a webpage may have a 'contact us' button at the top of the page and all the contact details at the bottom of the page. A scrolling element could be set up in this scenario so that when 'contact us' is clicked the page auto scrolls to the contact details at the bottom of the page.

To set up auto-scroll:

  1. First determine which element is to be clicked to trigger the auto-scroll (element 1), then determine the element that is to be scrolled to (element 2)
  2. Click Element 1 > Click Settings in the tools palette
  3. Click the button labelled Add Behaviour at the bottom of the settings options
  4. Select Scroll To Element in the behaviour options
  5. Select Other Element
  6. Scroll to the Element 2, click on it, then click Apply on the menu bar at the top of the page
  7. Set the speed at which you wish the scroll to occur
  8. Set the trigger, usually this will be mouse click 
  9. Click OK

Auto-scrolls are becoming more and more popular as web design progresses, many designs now are opting for one long page with clickable elements that auto-scroll further down the page to the next section.