how to make this text changing effect
https://www.lekollektiv.ch/?ref=onepagelove
I want to know how to make the "hoi!" part that is keep regenerating.
Any ideas? Thanks!
12 Replies
Hyperplexed did a great tutorial on creating something similar to this a few months ago https://www.youtube.com/watch?v=W5oawMJaXbU
I use a version of it on my website where I adapted it to use an series of words defined in a data-attribute (I can DM you a link to my site my github link if you are interested)
@Chris Any chance you want share that code with me as well? And thanks for sharing that link I didn't know this channel but looks pretty cool.
OK, I hope I don't get into trouble for posting personal URLS here.... 😟
My site is https://www.cbolson.com (rather abandoned I'm afraid).
My github version of the code can be found here: https://github.com/cbolson/sandbox-JavaScript/tree/main/hyper
Hyperplexed does some amazing stuff - and they make it all look so easy 🙂
If you are not comfortable sharing it just don't, or send a PM. Or delete it afterwards
But thanks for sharing anyway, much appreciated
Looks good, and to the point. The style is definitely not what it's considered "modern" but honestly I prefer it this way. It's quite refreshing seeing websites that don't follow all the trends that keep popping up everywhere
@Chris @redtypokk If you are curious I made a version of this effect a while back, it's meant to highlight the letters that are different from the original instead. Here you can see a quick preview and a link to the code:
https://github.com/D10f/javascript_ramblings/tree/main#text_transition--ts
no worries about posting your own site, Chris. It's clear you're just sharing to be helpful 🙂
Oh I thought it was more concern for his privacy or something 😅
👍
that's his own thing to weigh 🙂 we've got rules against self promotion (outside of #self-promotion), I thought Chris meant he'd run afoul of those
no, I don't think that "modern" is ever a word that has been used to describe me 😅
exactly, I know that self promotion is not permited (nor is it something that I am particulary interested in doing here)
Yeah I honestly didn't even consider that was the case at all. It's not self-promotion it's being used as an example... I hope my link doesn't break the rules either
it's to prevent spam, people link their own githubs and codepens all the time in questions. We're getting off topic though, so don't worry about posting links in questions if it's useful to the answer ❤️
hi Christ thank you for your kind sharing, this is exactly what I want to make. I know that channel before but didn't know he makes these nice effects! I think this word shuffling effect looks quiet neat n interesting
hi Joao, thank you! I would check it!