JSFiddle - React, Tailwind, and code Playground

by luka kupunia

HTML

<button id="for-us">
    for us
</button>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<p>florem</p>

CSS

body {
    margin: 0;
    overflow-x: hidden;
}

#sale-animation {
    white-space: nowrap;
    position: relative;
}

#sale-animation svg:nth-child(1) {
    animation: sale-1 linear 10s infinite;
}

#sale-animation svg:nth-child(2) {
    animation: sale-2 linear 10s infinite 5s;
}

@keyframes sale-1 {
    from {
        transform: translate(100%, 0);
    }

    to {
        transform: translate(-100%, 0);
    }
}

@keyframes sale-2 {
    from {
        transform: translate(0%, 0);
    }

    to {
        transform: translate(-200%, 0);
    }
}
svg:not(:root) {
    overflow: hidden;
}

JavaScript

document.querySelector('#for-us').addEventListener('click',function(e){
	var a = document.querySelector('body').classList.add('aee');
})