基本JavaScript图像旋转木马不工作

我正在学习关于edX的课程，在家庭作业中，他们让我们构建一个带有图像的网页，这些图像通过JavaScript自动旋转。EdX提供了所有步骤的全部细节，所以你会认为我可以复制粘贴，一切正常；不幸的是，事实并非如此

var slideInterval=3500；
函数getFigures（）{
返回文档.getElementById（'carousel'）.getElementsByTagName（'figure'）；
}
函数moveForward（）{
var指针；
var figures=getFigures（）；
对于（变量i=0；i
@媒体未打印{
身体{
颜色：#635959；
}
标题{
背景色：#242323；
颜色：#EFEFEF；
}
h3，
第h4条{
颜色：#8C1018；
}
a条{
颜色：#314052；
}
}
收割台h1{
字号：4em；
}
主图>figcaption{
字体大小：0.75em；
字体：斜体；
}
主图>figcaption:：before{
内容：“上图”；
字体大小：粗体；
}
文章>时间{
浮动：对；
字体大小：0.75em；
字体重量：较轻；
}
@媒体不打印{
main>h3{
字号：2em；
}
}
标题{
填充：20px 50px；
}
主要{
填充：5px10px
}
@字体{
字体系列：“新闻周期”；
src:url（'../font/mod3_news_cycle.ttf'）格式（'truetype'）；
}
身体{
字体系列：“新闻周期”
}
@字体{
字体系列：“轨迹一”；
src:url（'../font/mod3_contail_one.ttf'）；
}
标题{
字体系列：“轨迹一”
}
文章{
利润率：5px0px；
填充物：5px 5px；
盒影：-1px-1px 6px#8888888
}
@媒体印刷品{
标题{
填充：0px；
}
文章{
盒影：无；
}
收割台h1{
字号：2em；
}
收割台h2{
显示：无；
}
}
章节#转盘>图>img{
显示：无；
保证金：0px自动；
}
截面#旋转木马>图.可见>img{
显示：块；
位置：相对位置；
溢出：隐藏；
}
截面#转盘>图>图{
显示：无；
}
截面图#转盘>图.可见>figcaption{
显示：块；
文本对齐：居中；
字体大小：粗体；
字号：1.5em；
}

康托索新闻
康托索新闻
准时，有话题
2017款汽车有望比以往任何时候都更省油
飓风本周末有可能在东海岸登陆
今年，许多医生正在转向数字健康记录
最新文章



注册我们的电子邮件
电子邮件地址
交付首选项：
每日的
每周的
月刊
您必须定义这两个类：

.visible {
  display: block;
}
.notVisible {
  display: none;
}

编辑：OP编辑了问题并更改了CSS，现在我的答案不再合适了

并将for循环更改为：

for (var i = 0; i < figures.length; i++) {
    if (figures[i].className == 'visible') {
        figures[i].className = 'notVisible';
        pointer = i;
    }
}


康托索新闻
准时，有话题
飓风本周末有可能在东海岸登陆
今年，许多医生正在转向数字健康记录
最新文章



注册我们的电子邮件
电子邮件地址
交付首选项：
每日的
每周的
月刊
问题出在指向javaScript的链接中。我写'rel'就像我在引用css样式表一样
你们得到了什么错误/意外的结果？嘿，伙计们。所以我对所有这些东西都非常陌生，但是当我转到控制台时，我没有看到任何错误。当我加载页面时，图像和标题会加载，但它不会将visible类传递给其他图像，因此它会保留在第一个图像上