MUI-改变waiting中的加载loading图片

如果你在使用MUI框架开发一套移动端的网站或打包Android的话，在跳转各个href的时候，应该会发现href无效化，OK。这就是MUI框架为了使得网页之间的跳转，尽量能与原生开发的效果保持一致所做出来的努力。

解决href跳转，我们一般都是使用下面这个javascript语句，通过调用mui.openWindow()函数来跳转界面，具体参数可以看MUI的手册。

mui('.dn_nav_ul').on('tap', 'a', function() {
                               var href = this.getAttribute('href');
                                    mui.openWindow(href);
                            });

但是，我们跳转后，发现他会有一个加载的loading图，像这样的

对很多项目需求来说，可能就需要更换一个loading图，而更换loading图的要求，我们需要参考下官方网站的解释：

接下来，就找到了这个描述

当初看到这里，还有点懵，他说的是自定义loading图标的路径，png格式，并且必须是本地资源地址； loading图要求宽是高的整数倍，显示等待框时按照图片的高横向截取每帧刷新。

找了一些资料，才明白高横向截取什么意思，高横向截取的意思就是我们可以把同一张图层，用PS复制10遍，并将图层从左到右排列在一起，可调节每张图层的旋转角度，最后拼接成一张png图片导出即可，下面就是我做好用的图

loading

然后将代码换成如下，注意loading-icon就是图片地址，必须是本地资源文件。

mui('.dn_nav_ul').on('tap', 'a', function() {
								var href = this.getAttribute('href');
								//非plus环境，直接走href跳转
								if(!mui.os.plus) {
									location.href = href;
									return;
								}
									mui.openWindow({
										url:href,
									show:{
								      autoShow:true,
								      aniShow:"slide-in-left",//页面显示动画，默认为；
				     				  duration:500,
								    },
								    waiting:{
									      autoShow:true,//自动显示等待框，默认为true
									      title:'正在加载...',//等待对话框上显示的提示内容
									       options:{
									       	loading:{
									       		display:"inline",
									       		icon:"images/loading.png",
									       		interval:100
									       	},
									      }
									   },
									 createNew:true,
									});
							});

希望能帮助到你。