javascript图像幻灯片适用于所有其他浏览器,但不适用于IE

时间:2013-03-08 21:34:22

标签: javascript

我有一个图像幻灯片,它可以在我尝试的任何其他浏览器中工作但不在IE中 - 它只是显示主图像。请有人告诉我,我不会发疯,这是一个我看不到的简单修复。

非常感谢

Mickeyjay。

以下代码:

<div id="image_slide"><img src="images/.......jpg" id="slideit" name="slideit" border="0">
<script type="text/javascript">
var dimages=new Array();
  var numImages=3;
  dimages[0]=new Image();
  dimages[0].src="images/.......jpg";
  dimages[1]=new Image();
  dimages[1].src="images/.......jpg";
  dimages[2]=new Image();
  dimages[2].src="images/.......jpg";
var curImage=-1;
function swapPicture()
{
  if (document.images)
  {
    var nextImage=curImage+1;
    if (nextImage>=numImages)
      nextImage=0;
    if (dimages[nextImage] && dimages[nextImage].complete)
    {
      var target=0;
      if (document.images.slideit)
        target=document.images.slideit;
      if (document.all && document.getElementById("slideit"))
        target=document.getElementById("slideit");
      if (target)
      {
        target.src=dimages[nextImage].src;
        curImage=nextImage;
      }
      setTimeout("swapPicture()", 1500);
    }
    else
    {
      setTimeout("swapPicture()", 150);
    }
  }
}
setTimeout("swapPicture()", 1500);
</script>

1 个答案:

答案 0 :(得分:1)

尝试这种简化的测试,想法是在开始交换之前加载你的图片,而不需要那样测试.complete

<html>
  <head>
    <title>Example</title>
  </head>
  <body>

  <div id="image_slide"><img src="intro.jpg" 
       id="slideit" name="slideit" border="0"></div>

  <script type="text/javascript">
    var curImage  = -1;
    var numImages = 2;
    var dimages   = new Array();

    function loadPictures()
    {
      dimages[0]     = new Image();
      dimages[0].src = "test1.jpg";
      dimages[1]     = new Image();
      dimages[1].src = "test2.jpg";

      setTimeout(swapPicture, 3000);
    }

    function swapPicture()
    {
      var nextImage = curImage + 1;
      if (nextImage >= numImages)
          nextImage = 0;

      document.images.slideit.src = dimages[nextImage].src;
      curImage = nextImage;
      setTimeout(swapPicture, 1500);
    }

    setTimeout(loadPictures, 1500);

  </script>

  </body>
</html>