This is probably the funniest Codepen I found this year!

This is rather a short post but I find this codepen by Bård N Hovde so awesome that I must share it with you:

Amazing what you can do with JavaScript and CSS, agree?

Please leave a comment if you like this as well or managed to hit the button. Also don't forget to follow me here and on Twitter for more upcoming posts!

Comments

[Chris Achard]

Ha, I saw this other day - it's fantastic :)

For anyone looking in the code for the 'trick' (of hiding the mouse), it's done by setting the cursor in JS on this line:

const screenStyle = cursorGrabbed ? { cursor: "none" } : {};

and then the fake mouse pointer is part of the hand graphic. Brilliant!

[SavagePixie]

Oh, so there is a cursor trick! I've seen it on my mobile, where you can obviously just tap on things, so I hadn't caught on this feature.

[sanjaysupanch]

oSM

[Gabe Romualdo]

Pretty fun, with a combination of fast mouse movements and right-click trickery, I managed to produce a waving hand without changing any of the code.

— Gabriel

[Sebastian Gutierrez]

I just pass the mouse very close to the bottom of page hahaha

[Fulton Browne]

that worked for me

[Abhinav Kulshreshtha]

But you won't be able to press the Button 😁.

[Amruth Pillai]

Brilliant use of CSS and logic. Had so much fun playing around with this.
And using the Chrome Dev Console, clicked the button using Javascript, this was the result.
Cool that the dev included that as well :)

[Antonio Salvati 🦊]

or focus it pressing tab :)

[Robin Kretzschmar]

That... was awesome! It really made me laugh loud in the office 👍🤣
Thanks for sharing this!

[Simon Holdorf]

You're welcome 😄

[Jakob Wildrain]

Yes, it is! Click on the text above the button (to gain focus) and use TAB to select the button, now press SPACE or ENTER. You have pressed the button and it changes the caption to "Nice one".
While it is technically not "clickable", it is indeed "pressable", to use your own word ;)

[Ross Coundon]

Love it, very clever :-D

[Kobe Raypole]

This made me laugh, yet oddly frustrated at the same time.

[Giovanni Giordano]

Passing by the bottom-left corner you can go on the button :D

[Illia Pyshniak]

If you press the button and then give your cursor to bottom buddy...

[Teerapat Prommarak]

Awesome!