javascript - 我怎样才能将一张图片淡化到另一张之前

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 I WANT THE FADE :)，有没有办法让它显示一张图片 2 秒，然后淡入随机图片？谢谢

Answer 1

最简单的方法是使用 jQuery:

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