Scrolling Marquee Text Tutorial

5 mins

Resources

Copy and paste this code below into your Customizer > Additional CSS area:

/*SCROLLING MARQUEE*/

.scrolling-text{
–space: 2vw;
font-size: 2.5vw;
white-space: nowrap;
animation: marquee 10.5s infinite linear;
padding-left: var(–space);

&:after{
content: attr(data-text);
padding-left: var(–space);
}
}
@keyframes marquee {
0% {
transform: translateX(0)
}
100% {
transform: translateX(-50%)
}
}