Having trouble adding a static suffix to the end of animated counters. I want to include a "+" sign in some of them without animation.
I attempted to create a suffix class, but it doesn't append directly to the end value - it keeps showing up below the numbers. As a complete beginner, I apologize if there's an obvious solution that I'm missing! I've looked through the forums, but none of the approaches seem to match mine.
let values = document.querySelectorAll(".num");
let interval = 4000;
values.forEach((value) => {
let startValue = 0;
let endValue = parseInt(value.getAttribute("data-val"));
let duration = Math.floor(interval / endValue);
let counter = setInterval(function() {
startValue += 1;
value.textContent = startValue;
if (startValue == endValue) {
clearInterval(counter);
}
}, duration);
});* {
padding: 0;
margin: 0;
font-family: "Poppins", sans-serif;
}
body {
background-color: white;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
height: 100vh;
}
// rest of CSS code here
<div class="wrapper">
<div class="container">
// HTML content
// More HTML content here...
</div>
</div>