前端开发之弹出框系列教程五：Loading提示框 - 草根人物

前端开发之弹出框系列教程五：Loading提示框

 1、Loading样式一。

var loading=$k.loading();
//3秒后关闭加loading提示框
window.setTimeout(function(){
    loading.close();
},3000);

查看效果

 2、Loading样式二。

var loading=$k.loading({loadingCls:\'kui-window-loading-2\'});
//3秒后关闭加loading提示框
window.setTimeout(function(){
    loading.close();
},3000);

查看效果

 3、Loading样式三。

var loading=$k.loading({loadingCls:\'kui-window-loading-3\'});
//3秒后关闭加loading提示框
window.setTimeout(function(){
    loading.close();
},3000);

查看效果

 4、Loading样式四：文字提示

var loading=$k.loading({content:\'数据加载中...\'});
//3秒后关闭加loading提示框
window.setTimeout(function(){
    loading.close();
},3000);

查看效果

 5、自定义Loading提示内容

var content=\'<div class="kui-window-loading-1" style="width:100%;background-position:center;"></div><div class="kui-window-loading-text">数据加载中...</div>\';
var loading=$k.loading({content:content});
//3秒后关闭加loading提示框
window.setTimeout(function(){
    loading.close();
},3000);

查看效果