{
  "@context": "https://schema.org",
  "@id": "https://aggr.aymericbeaumet.com/items/hnrss-org/2026-11-05-lemmings-css-animation/#webpage",
  "@type": [
    "WebPage",
    "ArchiveComponent"
  ],
  "articleBody": "Add walkers with the button below or `__walker.add()`. Drag one to carry it, flick it to throw it. Resize the window and walkers ride the surface they're standing on, so a fast resize launches them.\n\n## Stairs\n\n## Stairs too tall to climb\n\n## Floating platforms\n\n## Pit\n\n## Walls\n\n## Cards\n\nThese wrap onto new rows as the window narrows, which shoves anyone standing on them.\n\n**Card one**\n\nBorders are solid. Walk the top edge or get trapped inside.\n\n**Card two**\n\nButtons and form fields are solid too.\n\n**Card three**\n\nText is a floor you can land on but walk through.\n\n**Card four**\n\nThrow a walker up here.\n\n## Cage\n\n## Reading\n\nColumns of text reflow a lot when the window changes size, so this is a good place to try a resize launch. Each line of text is its own floor. Walkers can drop from line to line, fall off the end of a short line, and land on whatever is below.\n\nLines sit closer together than a walker is tall, so text never blocks them. Only borders, boxes, buttons, images and fields do. That keeps walkers from getting stuck between two lines of a paragraph.\n\nNear the bottom of the page there is one long floor to catch anything that falls all the way down.\n",
  "authors": [
    "MarkBlah"
  ],
  "captured_at": "2026-11-05T09:48:06.467196556+00:00",
  "category": "news",
  "content_html": "<p>Add walkers with the button below or <code>__walker.add()</code>. Drag one to carry it, flick it to throw it. Resize the window and walkers ride the surface they're standing on, so a fast resize launches them.</p>\n<h2>Stairs</h2>\n<h2>Stairs too tall to climb</h2>\n<h2>Floating platforms</h2>\n<h2>Pit</h2>\n<h2>Walls</h2>\n<h2>Cards</h2>\n<p>These wrap onto new rows as the window narrows, which shoves anyone standing on them.</p>\n<p><strong>Card one</strong></p>\n<p>Borders are solid. Walk the top edge or get trapped inside.</p>\n<p><strong>Card two</strong></p>\n<p>Buttons and form fields are solid too.</p>\n<p><strong>Card three</strong></p>\n<p>Text is a floor you can land on but walk through.</p>\n<p><strong>Card four</strong></p>\n<p>Throw a walker up here.</p>\n<h2>Cage</h2>\n<h2>Reading</h2>\n<p>Columns of text reflow a lot when the window changes size, so this is a good place to try a resize launch. Each line of text is its own floor. Walkers can drop from line to line, fall off the end of a short line, and land on whatever is below.</p>\n<p>Lines sit closer together than a walker is tall, so text never blocks them. Only borders, boxes, buttons, images and fields do. That keeps walkers from getting stuck between two lines of a paragraph.</p>\n<p>Near the bottom of the page there is one long floor to catch anything that falls all the way down.</p>\n",
  "content_markdown": "Add walkers with the button below or `__walker.add()`. Drag one to carry it, flick it to throw it. Resize the window and walkers ride the surface they're standing on, so a fast resize launches them.\n\n## Stairs\n\n## Stairs too tall to climb\n\n## Floating platforms\n\n## Pit\n\n## Walls\n\n## Cards\n\nThese wrap onto new rows as the window narrows, which shoves anyone standing on them.\n\n**Card one**\n\nBorders are solid. Walk the top edge or get trapped inside.\n\n**Card two**\n\nButtons and form fields are solid too.\n\n**Card three**\n\nText is a floor you can land on but walk through.\n\n**Card four**\n\nThrow a walker up here.\n\n## Cage\n\n## Reading\n\nColumns of text reflow a lot when the window changes size, so this is a good place to try a resize launch. Each line of text is its own floor. Walkers can drop from line to line, fall off the end of a short line, and land on whatever is below.\n\nLines sit closer together than a walker is tall, so text never blocks them. Only borders, boxes, buttons, images and fields do. That keeps walkers from getting stuck between two lines of a paragraph.\n\nNear the bottom of the page there is one long floor to catch anything that falls all the way down.\n",
  "dateCreated": "2026-11-05T09:48:06.467196556+00:00",
  "date_created": "2026-11-05T04:54:10+00:00",
  "date_modified": "2026-11-05T04:54:10+00:00",
  "date_published": "2026-11-05T04:54:10+00:00",
  "description": "Add walkers with the button below or __walker.add(). Drag one to carry it, flick it to throw it. Resize the window and walkers ride the surface they're standing on, so a fast resize launches them. Stairs Stairs too tall to climb Floating…",
  "external_url": "https://markblah.github.io/lemmings/",
  "git": {
    "commit": "20068632b65d2830a2d54f25ca1d90d697bea2c0",
    "path": "items/hnrss-org/2026/11/2026-11-05-lemmings-css-animation.md",
    "permalink": "https://github.com/aymericbeaumet/aggr-instance/blob/20068632b65d2830a2d54f25ca1d90d697bea2c0/items/hnrss-org/2026/11/2026-11-05-lemmings-css-animation.md"
  },
  "id": "urn:aggr:item:68f98689e6bff4932bcf48c10683305d66a186ef",
  "isBasedOn": {
    "@id": "https://markblah.github.io/lemmings/"
  },
  "mainEntity": {
    "@id": "https://markblah.github.io/lemmings/",
    "@type": "CreativeWork",
    "archivedAt": {
      "@id": "https://aggr.aymericbeaumet.com/items/hnrss-org/2026-11-05-lemmings-css-animation/#webpage"
    },
    "author": [
      {
        "@type": "Person",
        "name": "MarkBlah"
      }
    ],
    "dateModified": "2026-11-05T04:54:10+00:00",
    "datePublished": "2026-11-05T04:54:10+00:00",
    "headline": "Lemmings CSS Animation",
    "timeRequired": "PT1M",
    "url": "https://markblah.github.io/lemmings/",
    "wordCount": 210
  },
  "name": "Archived snapshot: Lemmings CSS Animation",
  "preview": null,
  "reading_minutes": 1,
  "replicated_at": null,
  "source": "hnrss-org",
  "source_name": "Hacker News: Front Page",
  "summary": null,
  "tags": [],
  "temporalCoverage": "2026-11-05T09:48:06.467196556+00:00",
  "title": "Lemmings CSS Animation",
  "url": "https://aggr.aymericbeaumet.com/items/hnrss-org/2026-11-05-lemmings-css-animation/",
  "word_count": 210
}