显示所有图像的JavaScript幻灯片

“我的幻灯片放映”一行一次显示所有图像，直到单击“下一步”或“上一步”按钮，幻灯片放映才能正常运行。我发现了一个类似的线程，问题最终是语法错误。我一遍又一遍地阅读代码，看不出问题所在。请让我知道我做错了什么。谢谢大家!

    .ssbutton{
        border:none;
        display:inline-block;
        outline:0;
        padding:8px 16px;
        vertical-align:middle;
        overflow:hidden;
        text-decoration:none;
        color:inherit;
        background-color:inherit;
        text-align:center;
        cursor:pointer;
        white-space:nowrap
    }



    var slideIndex = 1;

    showDivs(slideIndex);

    function plusDivs(n) {
      showDivs(slideIndex += n);
    }

    function showDivs(n) {
      var i;
      var x = document.getElementsByClassName("Slide");
      if (n > x.length) {slideIndex = 1}    
      if (n < 1) {slideIndex = x.length}
      for (i = 0; i < x.length; i++) {
         x[i].style.display = "none";  
      }
      x[slideIndex-1].style.display = "block";  
    }





<div class="slideShow">
     <img class="Slide" src="images/Pic1.png">
     <img class="Slide" src="images/Pic2.png">
     <img class="Slide" src="images/Pic3.png">
     <img class="Slide" src="images/Pic4.png">
        <button class="ssbutton" onclick="plusDivs(-1)">&#10094;Prev</button>
        <button class="ssbutton" onclick="plusDivs(1)">Next &#10095;</button>
</div>

.ssbutton{
边界：无；
显示：内联块；
大纲：0；
填充：8px 16px；
垂直对齐：中间对齐；
溢出：隐藏；
文字装饰：无；
颜色：继承；
背景色：继承；
文本对齐：居中；
光标：指针；
空白：nowrap
}
var slideIndex=1；
showDivs（slideIndex）；
函数plusDivs（n）{
showDivs（slideIndex+=n）；
}
函数showDivs（n）{
var i；
var x=document.getElementsByClassName（“幻灯片”）；
如果（n>x.length）{slideIndex=1}
如果（n<1）{slideIndex=x.length}
对于（i=0；i

您需要默认隐藏

.Slide

元素，您可以在CSS中设置：

.Slide {
   display: none;
}
/* show first slide by default */
.Slide:first-child {
   display: block;
}