Pinegrow Interactions is a powerful visual editor for designing web interactions and animations.
Pinegrow Interactions is an add-on for Pinegrow Web Editor, extending its HTML and CSS editing features with interaction composer and fully-featured animation timeline editor.
Pinegrow Interactions is available in Pinegrow Web Editor 5.9 and higher.
Quick introduction
Read Introduction to Pinegrow Interactions to get an overview of what interactions are and how they are used.
Interactions actions
Check out the guides for interactions actions to learn how to use them.
You can open these guides directly in Pinegrow Web Editor with “Open URL” feature and explore examples of interactions.
Interactions
Use the Interactions action to add one or more interactions to the selected element.
Scroll Scene
Use Scroll Scene action to animate the element as it scrolls in and out of view.
Hide at Start
Add Hide at start to elements that need to be hidden when page loads so that you can reveal them with interactions.
Show at Start
Place Show at start on elements that need to be displayed when page loads so that you can hide them with interactions.
Smooth Scroll
Use the Smooth Scroll action to smooth the scroll wheel scrolling. That makes the Scroll scene animations appear more natural.
Apply to Many
Use this action to copy all interactions actions from this element to other elements on the page.
Topics
Check out detailed guides with embedded examples.
Interactions Panel
Use the Interactions panel to add interactions, scroll scenes and other interactions actions to the selected element.
Timeline Editor
Use the timeline editor to create powerful custom animations.
Animation properties
Overview of animating various element properties with the Timeline editor.
Selecting target elements
Use the Element selector control to select one or more elements on the page.
API
Pinegrow Interactions comes with a simple API that lets you trigger animations from your code.
License
Pinegrow Interactions come with a friendly license that lets you freely use interactions in your projects. Includes FAQ.
Tutorials
Learn about creating rich web interactions with our step-by-step tutorials.
Examples
Above listed guides come with a bunch of embedded examples that you can explore directly in Pinegrow Web Editor.
Here are some additional standalone examples: