Display text tooltip on hover

Ask us anything How do I?
#1

Hello!

I’ve been dabbling with WeWeb for my new website. It has a bunch of semi-complex functionality, and WeWeb has been working so well for me! One of the things I want to do is show a text tool tip on hover over an image element (eg hover over my picture to display my name). Is this possible currently? I’ve attached an image for reference. I hovered over the pencil and got this tooltip.

Screenshot 2022-04-14 at 16.36.40
Screenshot 2022-04-14 at 16.36.401010×164 28.2 KB

TIA!

2 Likes
#2

Hi @pranavpathak.91 :wave:

Yes, you could:

  • design a tooltip message,
  • bind its display to a boolean variable that has the default value “false”, and
  • create workflows that change that variable value on mouse enter and on mouse leave

Screenshot 2022-04-15 at 11.05.37
Screenshot 2022-04-15 at 11.05.371604×1120 59.6 KB

Does that make sense?

1 Like
#3

And success! Thank you!

1 Like
#4

Yey! Well done @pranavpathak.91 :raised_hands: :grinning:

#5

Just to add more info for those who still don’t know how to close & open the tool tip.

You need to add “!” on the formula to have open & close functionality

See the screenshot below

Screen Shot 2022-08-05 at 10.32.31 AM
Screen Shot 2022-08-05 at 10.32.31 AM941×745 40.6 KB

#6

This thread is great and helpful! I found that binding the variable to the tooltip’s opacity works nicely too - you get a smoother reveal and hide, if that’s something you are interested in

2 Likes