如何使此純JS輪播展示第一張圖片？

Question

我有一個純粹的JavaScript輪播，可從這里問到的另一個問題中找到（我不擁有此代碼的所有權）。

我需要使輪播顯示第一張圖片，當前正在顯示第二張圖片，（我對JavaScript的了解不是很好，所以我已經盡力了。）

（這僅適用於拼貼畫中的項目。）

 var firstval = 0; function Carousel() { firstval += 2; parent = document.getElementById('container'); parent.style.left = "-" + firstval + "%"; if (!(firstval % 100)) { setTimeout(Carousel, 3000); firstval = 0; var firstChild = parent.firstElementChild; parent.appendChild(firstChild); parent.style.left= 0; return; } runCarousel = setTimeout(Carousel, 20); } Carousel(); 

 #wrapper { position: relative; width: 100%; height: 300px; margin: 0 auto; overflow: hidden; } #container { position: absolute; width: 100%; height: 300px; } .child { width: 100%; height: 300px; padding-top: 35px; float: left; text-align: center; font-size: 60px; } #a { background: #FF0000; } #b { background: #FFFF00; } #c { background: #00FFFF; } 

 <div id="wrapper"> <div id="container"> <div id="a" class="child">a</div> <div id="b" class="child">b</div> <div id="c" class="child">c</div> </div> </div> 

的jsfiddle

Answer 1

這是一個非常簡單的解決方案

只需在您的Carousel（）初始調用中添加一個超時：

setTimeout(function(){
    Carousel();
}, 3000);

工作提琴： https : //jsfiddle.net/wzkLjh8s/6/