ATProto Browser

ATProto Browser

Experimental browser for the Atmosphere

Post

Rotating slider with smooth animations using HTML, CSS & Vanilla JS It includes hover effects, dynamic transforms, responsive design, and a snowfall background with Particles.js. #javascript #CSS #particlesjs #backgroundanimation šŸŽ¬ YouTube: youtu.be/bkpbaDKmm5Y

Jan 7, 2025, 12:41 PM

Record data

{
  "uri": "at://did:plc:vuloe54fo6zhmh4dj3d6esog/app.bsky.feed.post/3lf5ocp6pys2g",
  "cid": "bafyreih76gebpicher47oc2g2qkrtrgaknn6zy4rrlmuuhuku3sn5fyszy",
  "value": {
    "text": "Rotating slider with smooth animations using HTML, CSS & Vanilla JS \n\nIt includes hover effects, dynamic transforms, responsive design, and a snowfall background with Particles.js. \n\n #javascript #CSS #particlesjs #backgroundanimation\n\nšŸŽ¬ YouTube: youtu.be/bkpbaDKmm5Y",
    "$type": "app.bsky.feed.post",
    "embed": {
      "$type": "app.bsky.embed.external",
      "external": {
        "uri": "https://youtu.be/bkpbaDKmm5Y",
        "thumb": {
          "$type": "blob",
          "ref": {
            "$link": "bafkreihjzgi4uya7o2z4avsqudgw5s7atndah2ikpjbalkkbl4xohbjlmu"
          },
          "mimeType": "image/jpeg",
          "size": 979717
        },
        "title": "Interactive Rotating Slider with CSS & Vanilla Javascript | Background Animation #slider",
        "description": "YouTube video by Ecem Gokdogan"
      }
    },
    "langs": [
      "en"
    ],
    "facets": [
      {
        "index": {
          "byteEnd": 195,
          "byteStart": 184
        },
        "features": [
          {
            "tag": "javascript",
            "$type": "app.bsky.richtext.facet#tag"
          }
        ]
      },
      {
        "index": {
          "byteEnd": 200,
          "byteStart": 196
        },
        "features": [
          {
            "tag": "CSS",
            "$type": "app.bsky.richtext.facet#tag"
          }
        ]
      },
      {
        "index": {
          "byteEnd": 213,
          "byteStart": 201
        },
        "features": [
          {
            "tag": "particlesjs",
            "$type": "app.bsky.richtext.facet#tag"
          }
        ]
      },
      {
        "index": {
          "byteEnd": 234,
          "byteStart": 214
        },
        "features": [
          {
            "tag": "backgroundanimation",
            "$type": "app.bsky.richtext.facet#tag"
          }
        ]
      },
      {
        "index": {
          "byteEnd": 270,
          "byteStart": 250
        },
        "features": [
          {
            "uri": "https://youtu.be/bkpbaDKmm5Y",
            "$type": "app.bsky.richtext.facet#link"
          }
        ]
      }
    ],
    "createdAt": "2025-01-07T12:41:44.918Z"
  }
}