javascript - 如何在 html 中向简单的幻灯片放映添加过渡

Question

这是我的幻灯片放映代码，我需要帮助添加从图片到图片的过渡效果。
如果有人有任何东西那就太好了！

<script type="text/javascript">
        var image1 = new Image()
        image1.src = "images/house 2.jpg"
        var image2 = new Image()
        image2.src = "images/desk.jpg"
        var image3 = new Image ()
        image3.src = "images/car.jpg"
        var image4 = new Image ()
        image4.src = "images/life.jpg"
    </script>
<p><img src="images/house.jpg" width="1100px" height="300" name="slide" style="margin-left: 75px; margin-top: 10px;" /></p>

     <script type="text/javascript">
                var step=1;
                function slideit()
                {
                    document.images.slide.src = eval("image"+step+".src");
                    if(step<4)
                        step++;
                    else
                        step=1;
                    setTimeout("slideit()",2500);
                }
                slideit();
            </script>

Answer 1

如果您愿意使用 jQuery 和 CSS3，本教程可以帮助您：

http://css3.bradshawenterprises.com/sliding/