当前加载完的资源个数/pic总数*100，就是加载进度的百分比了。
当然，我们没必要手动写自己的加载器，很多优秀的游戏框架已经帮我们做到了，比如phaser，下面是phaser实现预加载的代码，具体的示例点我，点我
在上述的例子中，我们先创建一个游戏对象，然后往这个游戏对象中添加了两个方法，boot方法执行的时候准备了一张进度条图片，loaderState方法执行的时候，加载游戏所需的图片，并在页面上显示当前的进度。在多关卡的游戏中，加载的设置尤为重要。
3、理解游戏
3.1、认识phaser
对于一款游戏来说，框架就是它的基石。好的框架能是开发者利器，能够帮助开发者做出强有力的，跨浏览器的游戏，能给广大玩家带来更精致的作品。Phaser是一款专门用于移动及桌面的HTML5 2D游戏开发的开源免费框架，内置游戏物理引擎，它也就是传说中100行代码之内搞定Flappy Bird的神器。通过这个框架我们可以很容易地开发桌面和移动的小游戏。接下来我会以这个框架为基础，了解游戏的开发知识。
你可以点击这里获取phaser源码。点我，点我!
Phaser是一个单独的js文件，你可以通过script的标签来使用它。