Question

今天我设法在javascript中创建了一个幻灯片，它有一个奇特的透明过渡，但是，我的问题是，在它再现前两个图像后，下一个图像将不会出现，幻灯片重复第二张图片和再一次。

我尝试了一些根本不起作用的方法。

对这个问题的任何帮助和见解对我来说都非常重要！

以下是我的代码的链接：eBRabp

我的Javascript代码：

// JavaScript Document
var myImage = document.getElementById('mySlide');

var imageArray = ["images/slider1.jpg","images/slider2.jpg","images/slider3.jpg","images/slider4.jpg","images/slider5.jpg","images/slider6.jpg","images/slider7.jpg"];

var imageIndex = 0;

function changeImage() {

  mySlide.className = 'hiding';

  setTimeout(function() {
    mySlide.setAttribute('src', 'images/slider2.jpg','images/slider3.jpg','images/slider4.jpg','images/slider5.jpg','images/slider6.jpg','images/slider7.jpg' + imageArray[imageIndex] + '.jpg');
    mySlide.className = 'showing';
  }, 1000);

  imageIndex++;

  if (imageIndex == imageArray.length) imageIndex = 0;
}

var intervalHandle = setInterval(changeImage, 3000);

Answer 1

问题在于：mySlide.setAttribute ... line ...当然，它不起作用，因为你放置了太多（错误的）参数。你只需要两个，因为你设置的图像数组很简单，所以：

mySlide.setAttribute('src',  imageArray[imageIndex]);

它应该工作： https://jsfiddle.net/9pd4hnyn/

幻灯片中的过渡无法正常工作

1 个答案: