创建淡入淡出效果

Question

我正在尝试使用canvas元素创建幻灯片，效果很好。点击下一步，你会看到另一张照片。 我想在下一张图片显示时添加一个从左到右的淡入淡出效果，但我不知道该怎么做。 我试过的所有东西都不起作用。

任何想法如何解决这个问题？

Answer 1

查看globalAlpha方法。通过更改此值（介于0和1之间），您可以更改画布上下文的Alpha值：

ctx.globalAlpha = 0.5; // half faded

使用变量增加/减少每个循环的值，您可以创建淡入/淡出效果。