Можно ли как-нибудь сделать на html сайте бегущую строку, которая будет показывать время и дату?

const ar_month = ["января", "февраля", "марта", "апреля", "мая", "июня", "июля", "августа", "сентября", "октября", "ноября", "декабря"]; 
 
setInterval(function() { 
  Data = new Date(); 
  Year = Data.getFullYear(); 
  Month = Data.getMonth(); 
  Day = Data.getDate(); 
  Hour = Data.getHours(); 
  Minutes = Data.getMinutes(); 
  Seconds = Data.getSeconds(); 
 
  let datetime = "Сегодня " + Day + " " + ar_month[Month] + " " + Year + " года " + Hour + ":" + Minutes + ":" + Seconds; 
  document.querySelector(".marquee-datetime").textContent = datetime; 
}, 1000);

@keyframes scroll { 
  0% { 
    transform: translate(100%, 0); 
  } 
  100% { 
    transform: translate(-300px, 0) 
  } 
} 
 
.marquee { 
  width: 100%; 
  overflow: hidden; 
} 
 
.marquee p { 
  animation: scroll 10s infinite linear; 
}

<div class="marquee"> 
  <p class="marquee-datetime"></p> 
</div>

let pad = 150; 
let speed = 0.1 
let text = document.querySelector('textPath'); 
let len = document.querySelector('#path').getTotalLength(); 
requestAnimationFrame(upd); 
let t = 0, v = 0; 
function upd(dt) { 
    t = dt - t; 
    text.textContent = new Date().toLocaleString(); 
    text.setAttribute('startOffset', (v += t*speed)%(len+pad)-pad); 
    t = dt; 
    requestAnimationFrame(upd); 
}

<svg  viewBox="0 0 660 199"> 
  <text font-size="25px"> 
    <textPath href="#path"></textPath> 
  </text> 
<path id="path" fill="none" d="M26,110C26,110,20.55,41.405,42,26C63.45,10.595000000000002,97.58500000000001,32.56,136,31C174.415,29.44,200.78,18.195,239,18C277.22,17.805,293,30.39,332,30C371,29.61,399.805,16.195,439,16C478.195,15.805,497.12,28.415,533,29C568.88,29.585,601.94,2.620000000000001,623,19C644.06,35.379999999999995,641,113,641,113"></path></svg>