Animaciones CSS a través del Scroll sin necesidad de JavaScript. 100% nativo

EMBED

Mon Jul 31 2023 22:07:11 GMT+0000 (Coordinated Universal Time)

Saved by @rstringa


https://codi.link/PGgxPk1hcnZlbCdzIFNwaWRlci1NYW4gMiB2YSBhIHNlciBsYSBib21iYTwvaDE+Cgo8aDI+VnVlbHZlbiBsb3MgZG9zIFNwaWRlci1NYW4sIFBldGVyIFBhcmtlciB5IE1pbGVzIE1vcmFsZXMsIHBhcmEgdW5hIG51ZXZhIHkgZW1vY2lvbmFudGUgYXZlbnR1cmEgZW4gbGEgYWNsYW1hZGEgZnJhbnF1aWNpYSBkZSBNYXJ2ZWwncyBTcGlkZXItTWFuLjwvaDI+Cgo8cD5CYWxhbmPDqWF0ZSwgc2FsdGEgeSB1c2EgbGFzIG51ZXZhcyBhbGFyYcOxYXMgcGFyYSByZWNvcnJlciBsYSBOdWV2YSBZb3JrIGRlIE1hcnZlbCwgY2FtYmlhIHLDoXBpZGFtZW50ZSBlbnRyZSBQZXRlciBQYXJrZXIgeSBNaWxlcyBNb3JhbGVzIHBhcmEgZXhwZXJpbWVudGFyIGhpc3RvcmlhcyBkaWZlcmVudGVzIHkgbnVldm9zIHBvZGVyZXMgw6lwaWNvcywgeSBoYXogZnJlbnRlIGFsIGljw7NuaWNvIHZpbGxhbm8gVmVub20gcXVlIGFtZW5hemEgY29uIGRlc3RydWlyIHN1cyB2aWRhcywgc3UgY2l1ZGFkIHkgYSBzdXMgc2VyZXMgcXVlcmlkb3MuPC9wPgoKPHA+UHJvdGFnb25pemFkbyBwb3IgdW5vIGRlIGxvcyBzdXBlcmjDqXJvZXMgbcOhcyBlbWJsZW3DoXRpY29zIGRlbCBtdW5kbywgTWFydmVsJ3MgU3BpZGVyLU1hbiAyIHByZXNlbnRhIGxhcyBoYWJpbGlkYWRlcyBhY3JvYsOhdGljYXMsIGxhIGltcHJvdmlzYWNpw7NuIHkgbGFzIHRlbGFyYcOxYXMgcXVlIGNhcmFjdGVyaXphbiBhbCB0cmVwYW11cm9zLCBpbnRlcnByZXRhZG8gdGFudG8gcG9yIFBldGVyIFBhcmtlciBjb21vIE1pbGVzIE1vcmFsZXMsIGVuIHN1IGx1Y2hhIGNvbnRyYSBlbCBwZWxpZ3Jvc28gVmVub20geSBlbCByZXN0byBkZSB2aWxsYW5vcyBkZWwgbXVuZG8gTWFydmVsLjwvcD4KCjxpbWcgc3JjPSJodHRwczovL2ltYWdlLmFwaS5wbGF5c3RhdGlvbi5jb20vdnVsY2FuL2FwL3JuZC8yMDIzMDYvMTIxOS82MGVjYTNhYzE1NTI0N2UyMTg1MGM3ZDA3NWQwMWViZjBmM2Y1ZGJmMTljY2QyYTEuanBnIiAvPgoKPHA+SW5zb21uaWFjIEdhbWVzIHB1YmxpY2EgdW5hIG51ZXZhIGlsdXN0cmFjacOzbiBkZWwgVmVub20gZGUgTWFydmVsJ3MgU3BpZGVyLU1hbiAyIGp1bnRvIGNvbiBkZXRhbGxlcyBkZWwgYW50YWdvbmlzdGEuIEVsIGp1ZWdvIGxsZWdhIGVsIDIwIGRlIG9jdHVicmUgc8OzbG8gcGFyYSBQUzUuPC9wPgoKPGltZyBzcmM9Imh0dHBzOi8vZ21lZGlhLnBsYXlzdGF0aW9uLmNvbS9pcy9pbWFnZS9TSUVQREMvc3BpZGVyLW1hbi0yLXNjcmVlbnNob3QtdmVub20tNGstbGVnYWwtMTNqdWwyMz8kMTYwMHB4JCIgLz4KCjxwPkVsIGxhbnphbWllbnRvIGRlIE1hcnZlbCdzIFNwaWRlci1NYW4gMiBlc3TDoSBwcmV2aXN0byBwYXJhIGRlbnRybyBkZSB0cmVzIG1lc2VzLCBjb25jcmV0YW1lbnRlIHBhcmEgZWwgMjAgZGUgb2N0dWJyZSBzw7NsbyBlbiBQUzUgKHVub3MgZMOtYXMgYW50ZXMgY29tZW56YXLDoSBzdSBwcmVjYXJnYSkuIEFudGVzLCBlc3RlIHZlcmFubywgSW5zb21uaWFjIEdhbWVzIHNlIGxvIGxsZXZhcsOhIGEgbGEgU2FuIERpZWdvIENvbWljLUNvbiAyMDIzIHBhcmEgbW9zdHJhcmxvIGEgbG9zIGFzaXN0ZW50ZXMgeSBjb21wYXJ0aXIgbnVldm9zIGRldGFsbGVzIGRlbCBwcm95ZWN0by48L3A+Cgo8aW1nIHNyYz0iaHR0cHM6Ly9nbWVkaWEucGxheXN0YXRpb24uY29tL2lzL2ltYWdlL1NJRVBEQy9zcGlkZXItbWFuLTItc2NyZWVuc2hvdC1zdG9yeS1kdW8tNGstbGVnYWwtMTNqdWwyMz8kMTYwMHB4JCIgLz4KCjxwPkVzdGFtb3Mgc2VndXJvcyBkZSBxdWUgVmVub20gc2Vyw6EgbGEgZ3JhbiBlc3RyZWxsYSBkZSBNYXJ2ZWwncyBTcGlkZXItTWFuIDIsIHVuYSBzZWN1ZWxhIHByb3RhZ29uaXphZGEgcG9yIFBldGVyIFBhcmtlciB5IE1pbGVzIE1vcmFsZXMgcXVlIHByb21ldGUgc3ViaXIgbGEgYXB1ZXN0YSB0YW50byBhIG5pdmVsIG5hcnJhdGl2byBjb21vIGp1Z2FibGUgY29uIHJlc3BlY3RvIGEgbGFzIGRvcyBhbnRlcmlvcmVzIGVudHJlZ2FzLiBTaW4gZW1iYXJnbywgSW5zb21uaWFjIEdhbWVzIGhhIGRlc3RhY2FkbyBkdXJhbnRlIGxhIGNlbGVicmFjacOzbiBkZSBsYSBTYW4gRGllZ28gQ29taWMtQ29uIDIwMjMgcXVlIG5vIGRlYmVyw61hbW9zIGRlc3ZpYXIgbGEgYXRlbmNpw7NuIGRlIEtyYXZlbiBlbCBDYXphZG9yLCB1biBhbnRhZ29uaXN0YSBxdWUsIGVuIHBhbGFicmFzIGRlIEpvbiBQYXF1ZXR0ZSwgZGlyZWN0b3IgbmFycmF0aXZvIGRlbCB2aWRlb2p1ZWdvLCBmdW5jaW9uYXLDoSBjb21vICJlbCBjYXRhbGl6YWRvciBkZSBsYSBoaXN0b3JpYSIgeSBzZXLDoSBlbCByZXNwb25zYWJsZSBkZSBxdWUgc2UgZGVzZW5jYWRlbmVuIGxvcyBhY29udGVjaW1pZW50b3MgZGUgZXN0YSBudWV2YSBhdmVudHVyYS48L3A+|Ym9keSB7CiAgbWF4LXdpZHRoOiA0NTBweDsKICBtYXJnaW46IDAgYXV0bzsKICBmb250LWZhbWlseTogc3lzdGVtLXVpOwoJbWFyZ2luLXRvcDogMTAwcHg7CgltYXJnaW4tYm90dG9tOiAxMDBweDsKfQoKaDEsIGgyIHsKICBmb250LWZhbWlseTogR2VvcmdpYSwgJ1RpbWVzIE5ldyBSb21hbicsIFRpbWVzLCBzZXJpZjsKfQoKaDIgewogIG9wYWNpdHk6IC43OwogIGZvbnQtc2l6ZTogMThweDsKICBmb250LXdlaWdodDogNDAwOwoJbWFyZ2luLWJvdHRvbTogMzJweDsKfQoKaW1nIHsKICB3aWR0aDogMTAwJTsKICBoZWlnaHQ6IGF1dG87Cn0KCkBrZXlmcmFtZXMgc2hvdyB7Cglmcm9tIHsKCQlvcGFjaXR5OiAwOwoJCXNjYWxlOiAyNSU7Cgl9CgoJdG8gewoJCW9wYWNpdHk6IDE7CgkJc2NhbGU6IDEwMCU7Cgl9Cn0KCmltZyB7Cgl2aWV3LXRpbWVsaW5lLW5hbWU6IC0taW1hZ2U7Cgl2aWV3LXRpbWVsaW5lLWF4aXM6IGJsb2NrOwoKCWFuaW1hdGlvbi10aW1lbGluZTogLS1pbWFnZTsKCWFuaW1hdGlvbi1uYW1lOiBzaG93OwoKCWFuaW1hdGlvbi1yYW5nZTogZW50cnkgMjUlIGNvdmVyIDMwJTsKCWFuaW1hdGlvbi1maWxsLW1vZGU6IGJvdGg7Cn0KCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCg