使用JavaScript的幻灯片放映

我写了这行代码来制作我网页上图片的动画：

var SlideShow=函数（容器）{
this.images=[]；
这个.curImage=0；
对于（i=0；i=this.images.length）{
这个.curImage=0；
}
setTimeout（nextSlide.bind（this），3000）；
};
下一个滑动调用（此）；
};
幻灯片放映（document.getElementById（“testslide”）；

---

幻灯片放映很有效，图片也会改变，但风格很无聊。我希望它要么从右向左滑动，要么淡入或类似的东西，任何风格，而不仅仅是改变。如何实现这一点？

不要使用JS隐藏图像。当文档加载时，在JS启动之前，所有图像将在一小部分时间内可见。使用CSS。使用CSS转换使其更好。并添加/删除一个类来告诉浏览器哪一个是前一个。谢谢Roko，我会尝试一下。

var SlideShow = function (container) {
    this.images = [];
    this.curImage = 0;
    for (i = 0; i < container.childElementCount; i++) {
        this.images.push(container.children[i]);
        this.images[i].style.display = "none";
        }

var nextSlide = function(){
    for (var i = 0; i < this.images.length; i++) {
        this.images[i].style.display = "none";
        }
        this.images[this.curImage].style.display = "block";
        this.curImage++;

        if (this.curImage >= this.images.length) {
            this.curImage = 0;
        }
        window.setTimeout(nextSlide.bind(this), 3000);
    };

    nextSlide.call(this);
};

SlideShow(document.getElementById("testslide"));