Streaming live at 10am (PST)

Hover new text block

I want to have a hover over that shows a new block of text over the initial but can not find anything on this!

state 1:Screen Shot 2020-06-23 at 9.05.44 PM|581x500

Hover:


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Hi @rach. Here are some steps to make that happen:

  1. Add a new div set to absolute position: full, with z: +1. This should make an overlapping div that covers the current text inside the div.
  2. Set the new div to display: none so that it is hidden.
  3. Add an onHover interaction on the bottom div (the one that you want to be shown first). Make it so when you hover on that div, the display of the hidden div is set to display: block. Now try it out. You should see when you hover over the original, the new one appears overlapping it.
  4. Set the onHover out to hide the div again so it disappears when you want.

Let me know if you’d like more clarification. Good luck!

When I select “full” in absolute position it is adjusting it to the very top of the page not my div block.

Make the parent div (the one it’s contained within) position: relative so it knows what it’s positioning itself to.

Auh I got it now. Thank you!