What cool stuff can I do with text?

Hello
Unfortunately this is an open-ended question, so I apologise in advance.
I have added text in the Hero section and I want it to be the centre of attention. Would you have any suggestions? I can’t see any options for it to change or modify when I hover over it; I can’t find any hover events. So my questions are:

  1. Is there a hover event for text?
  2. What cool stuff can you do to the text? Either when the move hovers over or its left idle.
  3. Is there a way to embed an image within the font lettering and when you hover over it, it slightly tilts and moves as if you are peeking into a keyhole?
  4. Is there any other cool stuff that anyone can recommend for text/font hero sections?

Context: The site is for a music band. The theme is edgey / mysterious .

Many thanks

Hey, can you give me link of your website, and I can suggest some ideas possibly

Thank you @Pakic . Please note that its not perfect! I’ve been experimenting with Rive.app (thats the text currently in the header that I can’t seem to place in the Hero section)

My site is:

TheFutureEgos | Homepage (divhunt.art)

Since I’ve asked the questions, I’ve been looking at these & don’t know if they are possible
Fluid text hover (codepen.io)
Repellers (codepen.io)
(cool) text effect (codepen.io)
However, I’d like to see if Divhunt features could do the heavy lifting rather than having to try to embed some of these in (as I can’t properly remember how to code)

FYI: I’m thinking that if I had to choose one outside of DivHunt, then this might be the easiest to implement was its only CSS.

(cool) text effect (codepen.io)

Do you know, would I just need to make ‘title’ into a tag (attribute)? And if so, how would I go about doing that?

Many many thanks for your help
David

Hey david,

That last example is quite easy, but currently we dont allow gif images, so you can’t upload one. We will approve that in future, for now my suggestion is to use regular image + tilt animation to make it a bit entertaining. Here’s a video tutorial on how to do that:

And here’s a full video tutorial for Tilt plugin that I showed you in video above:

1 Like

Hey @Pakic
I smiled all the way through that video. You read my mind. I initially tried (I’m not going to admit how long, but its definitely more than a few hours) to pull off this exact feature and failed. I particularly liked the glare effect in the tilt.js tutorial. I’ll implement this all today.
Thanks so much for your help. Keep up the good work
Much appreciated
David