layui弹出层控件的加载动画
代码如下:
调用动画:load_pageData();
关闭动画:layer.close(layer.index) 或 layer.closeAll(‘loading’);
js:
function load_pageData(){
layui.use('layer', function(){
let layer = layui.layer;
let index = layer.load(2,{
//icon支持传入0-2
shade: [0.4, '#000'], //0.5透明度的灰色背景
offset: ['40%', '45%'], //位置
content: '加载中...',
success: function (layero) {
layero.find('.layui-layer-content').css({
'color':'#fff',
'padding-top': '78px',
'padding-left': '13px',
'width': '60px',
'font-size':'16px'
});
}
});
});
}
css:
.layui-layer-ico16, .layui-layer-loading .layui-layer-loading2 {
width: 100px !important;
height: 100px !important;
/*background: url(loading-2.gif) no-repeat;*/ //layui自带动画效果
background: url('img/loading_more1.gif') no-repeat !important; //自己的gif动画路径
background-size: 80px 80px !important;
}