如何实现图片的淡入淡出效果，并使其在另一张图片之前显示？

Question

在JavaScript中；

function doSingle() {
var luck = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10'],
    imagesArray = ['th/sr/1.png', 'th/sr/2.png', 'th/sr/3.png'];
  var ssrArray = ['th/ssr/1.png', 'th/ssr/2.png', 'th/ssr/3.png']; 
  lucknumber = Math.floor((Math.random() * luck.length));

  if (lucknumber < 8) { 
    //HERE IS WHERE I WANT THE FADE :)
    function displayImage() {
      var num = Math.floor(Math.random() * ssrArray.length);
      window.canvas.src = ssrArray[num];
    }

    displayImage();
  } else {
    //HERE IS WHERE I WANT THE FADE :)
    function displayImage() {
      var num = Math.floor(Math.random() * imagesArray.length);
      window.canvas.src = imagesArray[num];
    };

    displayImage();
  }
} 

您能在哪里看到HERE IS WERE I WANT THE FADE :)，有没有一种方法可以显示一张图片2秒钟，然后淡入随机的图片？谢谢。

- Jack Fendi

---

你尝试过添加淡入淡出效果吗？ - peacetype

不好意思，我不知道关于代码中动画的任何内容。 - Jack Fendi

Answer 1

最简单的方法是使用jQuery：

$("#myImage").fadeIn();
$("#myImage").fadeOut();

- henriquehbr