and a number of elastic layer icon box style to use

A, layer of style icon

More style test the code:

layer.confirm('icon测试', {icon: 1, title:'提示'}, function(index){  
//do something  
alert("确认");  
layer.close(index);  
});  

Second, ask the box

Official Case:

layer.confirm ( 'do you think of front-end development?' , {   
 btn: [ 'important', 'wonderful'] // button   
}, function () {   
 layer.msg ( 'really important', {icon: 1 } );   
}, function () {   
    layer.msg ( 'may be so' , {   
    Time: 20000, // after 20s off automatically   
    btn: [ 'see', 'know' ]   
});   

});  

I used the need to modify the title, as the above code when testing the same style, to implement a custom title:

    var Message = "continue?" ;  
            // query block   
           layer.confirm (message, {icon: 3 , title: ' information presentation'}, function (index) {  
                // submitForm ();   
               layer.close (index);   
           });  

Third, the prompt layer

Official Case:

layer.msg ( 'defying prompt');  

The default time is 3 seconds off, the following effect (background ad official website, the net effect is translucent black):

Custom styles and time, as follows:

layer.msg ( 'operation is successful!', {icon: 6, Time: 2000 });   
icon pattern is 6, the closing time of 2 seconds. Results are as follows:

Fourth, the frame shells (custom page)

Official Case:

layer.open ({   
  type: . 1 ,   
  Skin: 'layui-Layer-Demo', // style class name   
  closeBtn and: 0, // no close button is displayed   
  Anim: 2 ,   
  shadeClose: to true , // turn off mask   
  content: 'content'   
});  

Results are as follows:

I use cases, use bombs to achieve layer box login:

layer.open ({     
               type: 2 ,     
               title: 'User Login' ,     
               MaxMin: to true ,     
               Skin: 'layui-LAN-Layer' ,     
               shadeClose: to true , // click off mask layer     
               area: [ '400px', ' 280px ' ],     
               Content: ' the login.html ' // URL display frame shells, the corresponding page   
           });    

Where 'login.html' login page, its effect is as follows :