Tool tip popup on hover effect using interactions

Design help Animations & Interactions
1

Hi,

I have an icon that I want to say what it is when hovered over. How can I do this? Right now I have it in a link box.

Thanks

2

Hi @Luccimia, the tutorial that I have linked below should help you to understand how to do a hover effect.

Let us know if you need additional help.

Cheers, Dave

3

Thanks for the video Dave. What about a tooltip type of popup above an icon that tells what it is when hovered over? I know this is usually done via JS, but is there functionality that allows for this in Webflow?

Thanks
Julie

4

hi @Luccimia, thanks for the clarification. We do not have tooltips yet that pop-up and as you said, this can be done in JS. We will likely add support for this in a future update :smile:

Cheers, Dave

5

Hi Dave,

here, enter link description here we can see exemple of tooltip. By moving on the ? icon the tooltip appears. Isn’t it possible to do this inside webflow ?

6

Hi @Stefan_fr, we do not have a built in Tooltips widget, that particular effect on that page was using some custom javascript and css. You can also use interactions like the Hover interaction to create popovers for elements, check some out at interactions.webflow.com.

I hope this helps, if not, let me know and I am happy to further assist :slight_smile: Cheers, Dave

7

Thank you very much Dave for your reply.
Webflow is really a good tool even ! :smile:

Cheers.

8

Hi @Luccimia, I may be a little late here, but I made a small demo on how to make a tool tip using interactions:

Demo: https://webflow.com/design/demokit?preview=72388b288a26874be319ca1f7412d4eb
Page Title: Tool Tip on Hover

Hope this helps out a bit :slight_smile:

1 Like
9

That page won’t work for me. Did you guys implement a tool tip type tool or have a good tutorial to create one?

Thanks!

10

@thewonglv that link takes me to an “access denied” page. We’d really love to see that demo you made though!

11

i don’t think you should badge your pages as “made with webflow” if you need to go that far to make the page. i think it’s misleading, to be honest. i still find the webflow marketing promise at odds with the reality of the tool itself. there’s no way that designer in the main marketing video is writing custom javascript code. “now i can bring my vision to life without writing a line of code.” hmm… that line came after he mentioned parallax, btw. haha

on top of that, if you do have to write custom code for your own site, that should be a pretty giant clue that the feature you need yourselves needs to be a priority for the platform. i.e. tooltips. i mean, if you guys needed it for your own site a year and a half ago, it should be clear everyone does.

12

Hi Dave,
This link doesnt work and just shows general videos. Can you please provide a specific link?
Thanks a ton!
N