使用javascript制作图片

Question

我想使用JavaScript创建动画。

图片应该重复（循环），问题是当脚本到达最后的图片时有一个空的空间。

我要的是：PIC1> PIC2> PIC3> PIC4>图像pic5> PIC1> ...

代码：

<style type="text/css"> 
    img { 
     position: absolute; 
     center: 0px; 
     top: 0px; 
    } 

    #img3 { z-index: 3; } 
    #img2 { z-index: 2; } 
    #img1 { z-index: 1; } 
</style> 

<img style="top: 0px; height: 199px;" src="img1.jpg" id="img1"> 
<img img2.jpg" id="img2"><img src="img3.jpg" id="img3"> 


<script src="http://code.jquery.com/jquery.js"></script> 
<script> 
    $(function() { 
     $('img').first().fadeOut(2000, function suivante() { 
      $(this).next('img').fadeOut(2000,suivante); 
     }); 
    }); 
</script> 

我发现的是，我应该使用功能bis（）但我不知道如何！

Answer 1

请试试这个代码脚本部分

记本

var image1 = new Image() 
    image1.src = "images/1.jpg" 
    var image2 = new Image() 
    image2.src = "images/2.jpg" 
    var image3 = new Image() 
    image3.src = "images/3.jpg" 
    var image4 = new Image() 
    image4.src = "images/4.jpg" 
    var image5 = new Image() 
    image5.src = "images/5.jpg" 
    var image6 = new Image() 
    image6.src = "images/6.jpg" 
    var image7 = new Image() 
    image7.src = "images/7.jpg" 



<img src="images/1.jpg" name="slide" style="float:left;padding-right:10px;height:100px;width:250px" /> 
       <script> 
     <!-- 
      //variable that will increment through the images 
      var step = 1 
      function slideit() { 
       //if browser does not support the image object, exit. 
       if (!document.images) 
        return 
       document.images.slide.src = eval("image" + step + ".src") 
       if (step < 7) 
        step++ 
       else 
        step = 1 
       //call function "slideit()" every 2.5 seconds 
       setTimeout("slideit()", 2000) 
      } 
      slideit() 
     //--> 
     </script> 

Answer 2

你所有的工作都由淡出隐藏所有图像，但从来没有让他们看到again.Add下面的代码在的开始时功能suivante（）：

if($(this).attr("id")==="img5"){ 

    $('img').attr("display","block"); 

}