Hello!
I’m loving WebFlow, but I still have a lot to learn!
I’ve created an area of vertical navigation on my Home page with Hover interactions. Right now in the attached, shared preview, the Writing and Design links are (kind of) working, but I have two issues/questions.
The way I would like this to work is that when you mouse over a link, e.g., Writing, the opacity on TypeWriterBlock changes from 0% to 100% and back to 0% when the mouse is moved off the Writing link. And, when you hover over the Design link, the DesignBlock fades up in the same place, on the right-hand column SampleCol. I am assuming that I have to change the z-index of each of these two blocks and I’ve done that.
I’m having two problems with this:
- First off the hover does not seem to be working the way I would expect it to behave. I thought that I specified that on launch the region to the right, e.g., TypeWriterBlock would have an opacity of 0% and on hover it would change to 100%. But on initial load, TypeWriterBlock is at 100% and only when I hover over and then off of Writing does it go to 0%.
- I don’t know how to layer the hidden blocks, e.g., TypeWriterBlock and DesignBlock. Even using different z-index values doesn’t seem to make any difference. They seem to be stacked one on top of another.
https://preview.webflow.com/preview/michaelcowan?preview=fa03714ee81af07f8e4585b75b42f20c
I would be extremely grateful for any help or suggestions!
Thank you,