我已经有了一个图像的画布，我想淡入淡出图像不断。我已经使用上面的代码：在Html5 canvas中淡入淡出
var canvas;
var context;
var ga = 0.0;
var timerId = 0;
var timerId1 = 0;
function init()
{
canvas = document.getElementById("myCanvas");
context = canvas.getContext("2d");
timerId = setInterval("fadeIn()", 300);
console.log(timerId);
}
function fadeIn()
{
context.clearRect(0,0, canvas.width,canvas.height);
context.globalAlpha = ga;
var photo = new Image();
photo .onload = function()
{
context.drawImage(photo , 0, 0, 450, 500);
};
photo .src = "photo .jpg";
ga = ga + 0.1;
if (ga > 1.0)
{
fadeOut();
goingUp = false;
clearInterval(timerId);
}
}
function fadeOut()
{
context.clearRect(0,0, canvas.width,canvas.height);
context.globalAlpha = ga;
var photo = new Image();
photo .onload = function()
{
context.drawImage(photo , 0, 0, 450, 500);
};
photo .src = "photo .jpg";
ga = ga - 0.1;
if (ga < 0)
{
goingUp = false;
clearInterval(timerId);
}
}
是否可以插入两个功能集成到setIntervals ??我想在淡入功能后触发fadeOut。这怎么可能？？
+0
你的意思是你想让图像闪烁？ (进，出，进，出......) –
+0
是的，确切的!!!不断淡出淡出！ –
+0
'照片.src =“照片.jpg”，打算打印错字？ –
)
