Функция запуска, когда анимация завершена без setTimeout - Vanilla JS

Question

Итак, я сделал анимацию, где div, называемый «ползунок», появляется с левой стороны экрана, расширяется вправо, а затем исчезает с правой стороны экрана. Я начал с width: 0;, затем преобразовался в полную ширину, изменил position на right и вернул width go обратно в 0 и изменил display на none. Анимация работает нормально, но, вероятно, при чрезмерном использовании setTimeout. Есть ли лучший способ написать этот кусок JavaScript и иметь один старт анимации, когда предыдущий закончился без использования setTimout?

window.addEventListener("DOMContentLoaded", function(){
  slider.style.width = "60%";
  slider.style.position = "absolute";
  setTimeout(function(){
    slider.style.right = "25%";
    slider.style.width = "0px";}, 750);
  setTimeout(function(){
    slider.style.display = "none";}, 1500);
});