Text → Video Interaction

Hello,

I’m making an interactive essay using Readymag and have a question about text interacting with video.

As you scroll down, I want a certain portion of the text to become highlighted. This indicates interactivity. If you click this highlighted text, a video will play (either over the text or beside depending on desktop or mobile).

I guess I have two questions:

  1. How do I make the text change (become highlighted) as you scroll down? For desktop, can I make the highlighted text appear on hover?
  2. How do I make clicking on text cause the video appear and play? Do I duplicate the page, add the video to the new page, and then link the text to that page? Or can all of this happen on the same page?

Thanks.

1 Like

Hope this is not too late:

  1. You can present a second version of the same text using On Scroll animations. Opacity is the effect you’d have to use. As for hover, for text, in the Style tab, you can set a different style for the hovered state.
  2. Simply add the video, include an On Click animation (with opacity effect) to it and have the text selected as the trigger.
1 Like