Refresh after 5 seconds forever loop

rv-solutions commented 5 years ago

Can anyone advise on the best way to make the counter refresh every 5s ? (I'm pulling a constantly updating string into odometer)... Working fine on a manual page refresh but would love it to be automatic... Thanks!

SEASemester commented 5 years ago

Did you ever get a solution for this?

rv-solutions commented 5 years ago

Nope - the project I was working on fizzled out luckily!

adamschwartz commented 5 years ago

Here’s a minimal example which sets an odometer to 100 and updates it by 1 every 5 seconds. I hope this helps!

<!doctype html>

<link rel="stylesheet" href="https://unpkg.com/odometer@0.4.8/themes/odometer-theme-minimal.css"/>
<style>
  html, body {
    margin: 0;
    padding: 0;
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .odometer {
    font-family: Monaco, monospace;
    font-size: 10vw;
  }
</style>

<div class="odometer">100</div>

<script src="https://unpkg.com/odometer@0.4.8/odometer.js"></script>
<script>
  let number = parseInt(document.querySelector('.odometer').textContent, 10)

  const updateNumber = () => {
    document.querySelector('.odometer').textContent = number
    number += 1
  }

  setInterval(updateNumber, 5000)

  updateNumber()
</script>

Live demo

HubSpot / odometer

Refresh after 5 seconds forever loop #168