web-scrolling-text
Version:
A lightweight, customizable text animation library for creating smooth scrolling text effects with support for React, Next.js, Angular and vanilla JavaScript
8 lines (7 loc) • 1.45 kB
JavaScript
/**
* ScrollingText-glitch v6.1.5
* build on Wed, 31 Dec 2025 04:31:21 GMT
* (c) 2025 Hardik Naik
* Released under the MIT License.
*/
var t="scrolling-text-glitch-in",a="scrolling-text-glitch-out";!function(t,a){void 0===a&&(a={});var n=a.insertAt;if("undefined"!=typeof document){var i=document.head||document.getElementsByTagName("head")[0],e=document.createElement("style");e.type="text/css","top"===n&&i.firstChild?i.insertBefore(e,i.firstChild):i.appendChild(e),e.styleSheet?e.styleSheet.cssText=t:e.appendChild(document.createTextNode(t))}}("@keyframes scrolling-text-glitch-in{0%{clip-path:inset(50% 0 30% 0);opacity:0;transform:translateX(-20px)}20%{clip-path:inset(10% 0 60% 0);opacity:1;transform:translateX(10px)}40%{clip-path:inset(40% 0 40% 0);transform:translateX(-5px)}60%{clip-path:inset(80% 0 5% 0);transform:translateX(5px)}80%{clip-path:inset(10% 0 80% 0);transform:translateX(-2px)}to{clip-path:inset(0 0 0 0);opacity:1;transform:translateX(0)}}@keyframes scrolling-text-glitch-out{0%{clip-path:inset(0 0 0 0);opacity:1;transform:translateX(0)}20%{clip-path:inset(20% 0 50% 0);transform:translateX(-5px)}40%{clip-path:inset(60% 0 10% 0);transform:translateX(10px)}60%{clip-path:inset(30% 0 60% 0);transform:translateX(-10px)}80%{clip-path:inset(80% 0 5% 0);opacity:1;transform:translateX(5px)}to{clip-path:inset(10% 0 80% 0);opacity:0;transform:translateX(-20px)}}");var n={enterAnimation:t,exitAnimation:a};export{n as default};