I can’t figure out how to get a particular effect using Show/Hide transitions. Unfortunately, for confidentiality and IP reasons, I cannot give outsiders access to our full website, and Webflow doesn’t provide a way to share just a portion of a website (a serious deficiency, in my opinion). Since I don’t have time at the moment to recreate an example of my problem in a brand new website, I will attempt to explain the issue in prose.
Fortunately, there is a webpage that shows exactly what I am trying to achieve: http://www.elitedestinationhomes.com/ownership/
If you scroll down this page, you will find a list of topics with a red arrow to the left of each topic. If you click on any topic, the hidden text is revealed. If you click on the topic again, the text is hidden. If you click on another topic with the previous topic’s text revealed, the previous topic’s text is hidden and the new topic’s text is revealed. If you go back to the previous topic and click on it again, the text is revealed again. This last effect is what I cannot figure out how to do in Webflow.
I have been able to duplicate most of the show/hide behavior. For my own list of topics, I have no problem revealing the hidden text when a topic is clicked, and I have no problem hiding the previous topic’s text when a new topic is clicked. What I can’t figure out how to do is to re-reveal the text of a topic I have previously clicked on AFTER I have clicked on another topic. The problem seems to be that the second click transition for the previously-clicked topic – a hide the text transition – is not “forgotten” after clicking on another topic, so the text remains hidden instead of revealed.
Let me explain it a different way. For any given topic, I have no difficulty creating a two-click show/hide transition. The first click reveals the text and the second click hides the text. If I click back and forth on the same topic WITHOUT clicking on another topic, the show/hide cycle works fine.
However, the problem starts when I click on topic #2 while the text for topic #1 is still revealed. I have created a series of transitions for the first click on any topic first hides the text for the previously-clicked topic and then reveals the text for the topic just clicked on. So far, so good. As long as I keep clicking on new topics, the text of each new topic is revealed and the text for the previously-clicked topic is hidden.
However, if I click AGAIN on topic #1 after clicking on topic #2 (which hid topic #1’s text), topic #1 does not reveal its text again. Instead, topic #1 “remembers” that it still has a second click transition to activate – a “hide” transition – so nothing at all happens when I click again on topic #1 because the text was already hidden by topic #2.
The behavior I want is for topic #1 to be “reset” after its text is closed by topic #2 so that topic #1’s first click transition is activated instead of the second click transition. I guess my core question is, how do I get each individual topic to “forget” the second click if the text has already been hidden by a “hide” transition activated by another topic?
Again, the link to the example website shows exactly what I want to achieve. There, I can show and hide text at will no matter where I click or the order in which I click.
Gosh, I hope that all make sense. Even my head spins a little bit when I reread it. If I have failed to communicate, feel free to ask questions.