# How to use "Add class" with scrolling page trigger Interaction

**URL:** <https://forum.pinegrow.com/t/how-to-use-add-class-with-scrolling-page-trigger-interaction/3723>\
**Category:** Beginners\
**Tags:** interactions\
**Created:** [January 26, 2020, 6:01pm UTC](https://forum.pinegrow.com/t/how-to-use-add-class-with-scrolling-page-trigger-interaction/3723 "2020-01-26T18:01:03Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![txirrindulari](https://avatars.discourse-cdn.com/v4/letter/t/b38774/32.png) [@txirrindulari](https://forum.pinegrow.com/u/txirrindulari)\
**Post date:** [January 26, 2020, 6:01pm UTC](https://forum.pinegrow.com/t/how-to-use-add-class-with-scrolling-page-trigger-interaction/3723/1 "2020-01-26T18:01:03Z")

</div>

Can someone show how to use the addclass with scrolling interaction?  
I have tried a few ways to add a css animation code with clip-path but I am not able to make it work.

---

<div class="post-metadata">

**Author:** ![matjaz](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/matjaz/32/5_2.png) [@matjaz](https://forum.pinegrow.com/u/matjaz)\
**Post date:** [January 27, 2020, 7:52am UTC](https://forum.pinegrow.com/t/how-to-use-add-class-with-scrolling-page-trigger-interaction/3723/2 "2020-01-27T07:52:06Z")

</div>

@txirrindulari take a look at the AddAndRemoveClassesOnScroll in Pinegrow Interactions Examples:  
[https://pinegrow.github.io/Pinegrow-Interactions-Examples/AddAndRemoveClassesOnScroll/](https://pinegrow.github.io/Pinegrow-Interactions-Examples/AddAndRemoveClassesOnScroll/)

In Pinegrow, you can open this page with Open URL and explore animations in the Interactions panel, or you can clone the whole repository to get a local copy of examples: [https://github.com/Pinegrow/Pinegrow-Interactions-Examples](https://github.com/Pinegrow/Pinegrow-Interactions-Examples)

 ![addclass](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/b/b89403e4464d0af46f3b4b20c9076f1d59482e55.jpeg)

Video:  
[https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/f/f9e1f0c7de00b3510654ef7b6721b3c0782f2293.mp4](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/f/f9e1f0c7de00b3510654ef7b6721b3c0782f2293.mp4)