What In Webflow 014 - šŸ˜² Reactive Text

In this episode of What In Webflow 014, we walk-through how to create a reactive text effect in Webflow:

To walk-through this tutorial with me, make sure you use the cloneable project at Reactive Type Effect - Webflow

Also, you can find a more comprehensive tutorial at https://www.superhi.com/video/how-to-make-reactive-type-as-seen-on-the-airbnb-cereal-site

Live site - http://reactive-type.webflow.io/

Read-only link - Webflow - Reactive Type

Clone link - Reactive Type Effect - Webflow

Hopefully, this was helpful. Feel free to let me know if this is helpful, or if you have any additional questions.

Iā€™m happy to help further!

7 Likes

Hi there,

I recently received a question to disable the script at a certain window size, and the following script will help do just that:

<script>
if (window.screen.width > 780) {
  document.write( 
    '<script src="https://cdn.rawgit.com/MicahRyan/Reactive-Type/5dd1faaf/js/reactive-type.js"><\/script>' 
  )
}
</script>

Hopefully, this was helpful. :nerd_face:

1 Like