真想做好一个H5，你一定要会这个方法！

内容没加载好，网页就跳转进去了！一张张图片慢慢显示出来，整得你的H5做得很low……怎么破？

今天揭秘的正好是这个让很多iH5新老用户头疼的问题，如何灵活地调整预加载。温馨提示：一定要用iH5的3.0版工具做才行！

注：以下内容选自3.0 热心用户 heymu 在“iH5 Help”的回答。进入http://ih5qa.hiyime.com/，你会找到更多关于新工具使用的问题。

页面的预加载，有两种方法：

（1）使用系统自动的预加载，只要设置舞台的预加载。

（2）自定义每个页面单独的预加载，需要使用页面的加载事件。

一、系统自动的预加载

这里只需要选中舞台，设置它的属性。

填写预加载页数（N）后，案例会先加载完前N页，之后再进入首页。加载的进度，就是案例加载的进度，可以在“发布”的面板设置进度显示的样式：

注：iH5 3.0是免费让所有人使用和发布的，但自定义LOGO属于付费服务，需要购买企业套餐才可以设定。

需要注意的是：预加载除了在案例开始的时候进行，在案例播放过程中也会持续进行。

比如一个案例有10页，预加载设为3页。

当案例开始的时候，会加载前3页 （从对象树最下方开始算的前3页），然后才进入第1页；当用户进入第2页的时候，就会开始加载第4页，尽量保证当前有3页加载完毕。

所以案例播放至某一页的时候，它也会自动加载后面的几个页面。

二、页面的自定义加载

自定义加载，可以让每个页面在需要的时候才加载，并显示真实的加载进度。

如果要使用页面的自定义加载，要首先打开页面的“不参与预加载”属性，这样，系统预加载的时候，就会跳过这个页面了。

然后，我们需要在舞台或第一页添加页面预加载的动画。

比如以下案例中，我们加了一个首页。这个首页是普通的页面，在案例开始的时候就会加载出来，首页有两个按钮，分别跳转到场景一和场景二。

两个场景页面，都包含一个100张的图片序列，所以需要加载一段时间。但这两个场景，都设置了不参与预加载。

然后，在首页加一个加载动画。

注意，这个加载动画，需要独立于场景一和场景二页面，放在一个新的页面里。因为它要在场景一或场景二未加载完成时，开始播放。

然后，在场景一和场景二页面中分别加事件。如下图所示，设置在页面“开始加载”时，让加载动画显示；并设置“加载中”时，时间轴会根据加载进度来播放。

加载进度是一个0到1的数字，而我们在这里加的时间轴是10秒，所以要让时间轴跳至“加载进度*10秒”。

注：当页面触发事件是“加载中”，进行赋值时，值这一栏的“加载进度”不能手动输入，而需要点击右侧的下拉框选中“加载进度”这个属性才有效。

还有一个百分比的文本，要在页面加载时，把这个文本赋值为“加载进度*100”， 再加一个“%”表示加载进度是百分之几。

注：3.0版工具赋值的规则是用西文的单引号包围文本，并用加号连接不同的文本；数值则不需要用单引号包围。

由于系统获取的加载进度有很多小数位，这里加了一个round函数来四舍五入——用“round()”的括号包围赋值部分。

最后，返回首页的时候，得让原来的加载动画隐藏，并让时间轴跳回零点。

案例下载地址：

http://www.ih5.cn/editor3/app/workCopy/5554523

在电脑上登录iH5账号后，把上面这串地址粘贴在地址栏打开，这个案例就会下载到你的账号了！

快去试试吧~