Forum Academy Marketplace Showcase Pricing Features

Hover to Reveal Shape + Do when shape is not visible = Not Working

There’s a lot of posts in this forum that demonstrate this working but I can’t figure out why only half of it is for me. Can a person smarter than I please take a look (@fayewatson) ?
First part of showing group focus works. But then hiding the group focus when red shape isn’t visible doesn’t work.

Setup
3 Elements: Icon, Shape, Group Focus
Red Shape Condition = When Icon Hovered - This element visible. Red Shape properties: when page loaded = not visible


Workflow : Do While Condition is True (Only when Shape is Visible) - (this part works)
Another workflow item: Do while condition is true (only when shape isn’t visible) - this part doesn’t work. The Group Focus will not disappear. I know a fresh pair of eyes would help.

Result Group Focus won’t go away

References:


Hi @Blake

Actually, there’s an easier way to do this, which skips the red shape altogether. You can’t set an is hovered condition on a workflow, but you can copy/paste it there. So, if you right click the Icon fa fa-flash and choose copy, you can paste it into the Do when condition is true workflow.

Also, I notice the workflow is set to run just once. You probably want to set this to Every time.

Does that solve your issue?

4 Likes

Thanks for the reply…hmmm. I’m not following entirely though. @petter

1st and probably most fundamental, what do you mean, “the workflow is set to run just once”?
2nd I can’t seem to paste an element or even it’s condition expression into the workflow. What is supposed to happen when you paste an element onto a do when condition is true workflow item?

Hey @Blake, :slight_smile: @petter is referring to the “Do When Red Shape isn’t visible” workflow; right now, it’s set to run “Just once” - switching that to “Every Time” should fix the issue with the Groupfocus hiding every time the Red shape isn’t visible:

However @petter’s suggestion to skip the shape workaround altogether is definitely the way to go! The workflow composer won’t allow you to manually type the expressions “When Icon is hovered” or “When Icon isn’t hovered”, but we can create those expressions in a conditional, copy them, and paste them into the workflow composer (it sounds like it won’t work but it does! :slight_smile:).

Here is an example of how to set this up in the editor:

Editor: https://bubble.io/page?type=page&name=groupfocus_hover_new&id=faye-demo-app&tab=tabs-1
Preview: https://faye-demo-app.bubbleapps.io/version-test/groupfocus_hover_new

5 Likes

Thank you @petter and @fayewatson! When i was copying the expression from the editor, I had “This icon” instead of the name of the icon in the expression. Then when I went to paste the expression into the workflow it kept translating to this page instead of this icon, hence my confusion. Anyways the switch to actual icon name in the original expression did the trick.
Thanks again @petter for the more efficient way to get this done.

1 Like

This topic was automatically closed after 70 days. New replies are no longer allowed.