图像没有显示在github页面上

我正在使用github页面来托管一个练习网站。我已经建立了一个简单的JS幻灯片和幻灯片中的图像不显示。当我使用atomlive服务器来显示站点时,图像和幻灯片效果很好。使用github页面时,我查看了活动幻灯片,它在图像数组中移动,正如我所看到的 src 属性更改了它应该使用的方式,以便我知道代码正确地循环通过数组。我不知道怎么了。

相关的JavaScript

const image = [
  '../images/karakoy-1.jpg',
  '../images/karakoy-2.jpg',
  '../images/karakoy-3.jpg',
  '../images/karakoy-4.jpg',
  '../images/karakoy-5.jpg',
];
let i = 0;
const imageContainer = document.getElementsByClassName('slideshow-image');
const time = 3000;

function changeSlide() {
  imageContainer[0].src = image[i];
  if (i < image.length - 1) {
    i++;
  } else {
    i = 0;
  }

  setTimeout('changeSlide()', time);
}

changeSlide();

我还检查了文件名的拼写和大写字母。一切正常。就像我说的,当我使用atomlive服务器时,一切都正常。

更新 https://jtc10.github.io/Arcadia-Restaurant/

这里有一个网页链接。点击“预订”链接。幻灯片就在那一页上。