I did something on my site recently like that where you can click a hexagon and it turns into a robot and starts SLAM mapping the page, navigating around text elements carefully.
Were you initially surprised by how easy it was to get exact block size of individual characters and not just entire dom elements? That’s the part I thought was going to be the most difficult.
Nice! Your site is impressive and your achievements even more so.
html { overflow-x: clip; touch-action: manipulation; }
should fix them!
It is unfortunate that the scenery is positioned in such a way that lemmings end up falling by the side all the way to the bottom of the screen.
Perhaps it would look better if you removed the padding from <body> and added more pits to the scenery.
Other than respawning them as you scroll around, so one starts in an appropriate place as a test comes into view, and resetting them automatically, perhaps on a timer, there probably isn't a better way to properly show it off than that.
[1] http://xpenguins.seul.org/ and updated at https://github.com/Grumbel/xpenguins-ng
EDIT: works in Chrome and Firefox, doesn't work in Edge (on Linux - yeah, I know almost nobody uses that) for some reason...
1991, Psygnosis (of course), Commodore Amiga (double of course!): my little brother was 9 y/o at the time and we were teenagers and we'd play Lemmings like crazy on our Amiga.
My little brother couldn't speak english yes but he'd imitate the "oh, nooooo" sentence Lemmings you'd "suicide" would make.
More than three decades later my brother is still nicknamed "Lem" after "Lemmings" and that's how we call him. And about two decades ago, he gave his consulting company a name sounding like "Lemmings" (spelling slightly different). He's still "Lem" and he still has got that company.
Oh noooooooo!
And I overenjoyed throwing lil marios around
Thank you for bringing this to life.
Ok, this is awesome.
Without digging and building stairs and parachutes, it is only Lemmings in name, not in spirit. Also, exploding lemmings - this can probably be done via CSS animations.
Explanation: https://www.youtube.com/watch?v=uZ1atMUOUMU
Using the test: (async () => { const sleep = (ms) => new Promise((r) => setTimeout(r, ms)); for (let i = 0; i < 200; i++) { __walker.add(); await sleep(10); } })();
From the JavaScript console, on both Chrome and Safari.
The animation is _way_ smoother on Chrome, but scrolling on that page becomes really painful.
Safari, on the other hand, uses a lot more CPU to do the animation, and the FP of that animation drops dramatically as you change the number of lemmings from 10 -> 50 -> 100 -> 200. However scrolling the page remains smooth the entire time.