Rough Notation is a small JavaScript library to create and animate annotations on a web page.
This premium tutorial provides the steps to set up animated annotation (highlight, cross, circle, underline etc.) text on page load or as the text comes into view.
By default Rough Notation shows all the animated annotations on page load.
There could be times when your heading or other text is present below the fold and you want to bring focus to the text when the user has just finished scrolling past that element. We can achieve this using JavaScript's Intersection Observer API. This tutorial covers two variations using Intersection Observer - annotation animation triggering only once when the element enters the viewport and triggering on and off when scrolling down and back up.
Getting Started
Create a test Page, edit it with Oxygen and add a Heading and a Text component inside a Section.
