Почему мой requestAnimation с функциями setTimeout не работает в Chrome/Opera?

Я пытаюсь сделать анимированную галерею, которая будет плавно закрашивать первый слайд, затем некоторое время ждать, а затем перекрашивать следующий и так далее (слайды закрашиваются по кусочкам).

Я использовал для этого requestAnimationFrame, захваченный в setTimeout, и он работает так, как я хочу, но только в Firefox. Он вообще не вызывает анимацию в Chrome или Opera.

Я пытался закомментировать всю часть, которая анимирует слайд (чтобы рисовалась только первая его часть), но это не помогло. Пробовал также убрать всю ту часть, что разрезает холст и изображение на части и просто рисовать целое изображение, но тоже не помогло.

Вот jsfiddle https://jsfiddle.net/Valilna/64qmtpvu/3/

var slideW = slideObjectsArray[j].width;
var slideH = (slideW / sectionCountW) * sectionCountH;
var slideSectorW = slideW / 5;
var gallerySectorW = galleryWidth / 5;
var speedGallery = (gallerySectorW/100) * 5;
var speedSlide = (slideSectorW/100)*5;

function drawSlide () {
    for (n = 0; n < 5; n++) {
    if (speedGallery <= gallerySectorW) {
        ctx.drawImage(slideObjectsArray[j], slideSectorW * n, 0, 
                      speedSlide, slideH,
                      (gallerySectorW * (n + 1) - speedGallery), 
                      0, speedGallery, galleryHeight);
    } else if (speedGallery > gallerySectorW){
        speedGallery = gallerySectorW;
    ctx.drawImage(slideObjectsArray[j], slideSectorW * n, 0, 
                  speedSlide, slideH,
                  (gallerySectorW * (n + 1) - speedGallery), 
                  0, speedGallery, galleryHeight);
    }
  }

  if (speedGallery < gallerySectorW) {
    speedGallery += (gallerySectorW/100) * 5;
    speedSlide += (slideSectorW/100)*5;
    setTimeout(function () {
      requestAnimationFrame(drawSlide);
    }, 25);
  } else if (speedGallery === gallerySectorW) {
    speedGallery = (gallerySectorW/100) * 5;
    speedSlide = (slideSectorW/100)*5;
    if (j < 6){
      j ++;
    } else {
      j = 0;
    }
    setTimeout(function () {
      requestAnimationFrame(drawSlide);
    }, 4000);
  }

}

slideObjectsArray[0].onload = drawSlide;

Я новичок в программировании и только начал учиться, поэтому я уверен, что сделал какую-то глупую ошибку, и я был бы очень благодарен, если бы вы мне ее показали.