Javascript 使用<；帆布>；

我正在尝试使用canvas drawImage（）方法对图像进行交叉淡入淡出。我正在使用jQuery对画布进行fadeIn（）和fadeOut（）

代码如下：

$("#c").fadeOut(800,function() {
            //aw and ah are calculated here
        ctx = canvas.getContext('2d');      
        ctx.drawImage(img1, 0, 0, aw, ah);              
        $("#c").fadeIn(400);
});

c是画布的id。问题是-如果已查看img1，则淡出会在图像更改后发生，即首先图像更改，然后画布淡出并返回。我错过什么了吗？ 谢谢

似乎是。我唯一的问题是我必须使用

getElementById

而不是

$（）

来调用

getContext

并设置

img

变量

$("#c").fadeOut(800,function() {
    var canvas = document.getElementById("c");
    var aw = 100;
    var ah = 100;
    var img = document.getElementById("img" + (currentImage + 2));
    ctx = canvas.getContext('2d');
    ctx.drawImage(img, 0, 0, aw, ah);
    $("#c").fadeIn(400);
    currentImage = currentImage * -1;
});

似乎是。我唯一的问题是我必须使用

getElementById

而不是

$（）

来调用

getContext

并设置

img

变量

$("#c").fadeOut(800,function() {
    var canvas = document.getElementById("c");
    var aw = 100;
    var ah = 100;
    var img = document.getElementById("img" + (currentImage + 2));
    ctx = canvas.getContext('2d');
    ctx.drawImage(img, 0, 0, aw, ah);
    $("#c").fadeIn(400);
    currentImage = currentImage * -1;
});

---

谢谢！重置canvas变量成功了。我不知道为什么这很重要。非常感谢！重置canvas变量成功了。我不知道为什么这很重要。