I stumbled upon this landing page that apparently cost $90,000 to make, and I'm really curious about the animations on it. Can anyone explain how they create those "lightning" effects and the cool visuals at the top? Are they using specific libraries for these effects, or is it more about After Effects or similar software, probably converted to GIF or MP4 for embedding?
Also, the way the buttons light up when you hover over them is super impressive. I'm guessing there's some JavaScript magic involved? Would love to hear how this is all put together! Thanks!
5 Answers
The hover effects on the buttons are created using some simple CSS tricks. They use a `
Thanks for the tip on the link! It’s always great to see innovative web design, even if there are glitches present.
You can check out a video that illustrates how they did it here: [YouTube Link](https://www.youtube.com/watch?v=e45q6FbAbDw). But just a heads up, might be misleading—they say it uses WebGL, but I think it’s just a video that acts as the main backdrop.
Exactly! It’s odd they would change from WebGL to just a background video. Did they even check the final code?
If I were to replicate something like this, I’d take a simpler route. You can adjust image opacity based on mouse movement, similar to how those buttons interact. It’s really effective but not overly complicated!
Honestly, it looks great, but it crashes on my phone every time I try to view it. So, whatever they've done, it hasn't translated well to mobile.
Right? It’s wild they forked out $90k for that and it’s a mess on mobile!
Lol, what’s wrong with simply asking for details, Mr. Cynical?