关于canvas加载图片出现闪屏的简单解决方法

背景:博主最近在开发自己的基于HTML5的游戏中,需要加载背景图片.而在游戏运行中，出现了闪屏的现象.

在网上也查看了很多解决方法,多数说的是关于缓存方面的问题.但这样去解决这个问题未免小题大做.博主之前制作的游戏也用到了背景图片,但并没有出现这种情况.经过分析,可以通过以下方法解决.

解决方法：

canvas 加载图片使用 context.drawImage()  我们在设置背景图片的时候我们将图片的宽高均大于canvas的宽高就行

例如:

在我的游戏中canvas宽高分别为1000和600像素

<canvas id="id-canvas" width="1000" height="600"></canvas>

而我需要加载的背景图片我将宽高分别设置为1100,660像素 ------这样闪屏问题就解决了

当然我的宽高稍微设置大了点,可以适当减小.总之,背景图片宽高均大于canvas宽高!!!