Layui 彈出層組件——layer

     layer是作為Layui【經典模塊化前端框架】的一個彈層模塊，由於其用戶基數較大，所以把layer作為獨立組件來維護。

基礎參數：

　　基礎參數主要指調用方法時用到的配置項，如：layer.open({content: ''})layer.msg('', {time: 3})等，其中的content和time即是基礎參數，以鍵值形式存在，基礎參數可合理應用於任何層類型中，我們不需要所有都去配置，大多數都是可選的。而其中的layer.open、layer.msg就是內置方法。

1、type - 基本層類型

類型：Number，默認：0

layer提供了5種層類型。可傳入的值有：0（信息框，默認），1（頁面層），2（iframe層），3（加載層），4（tips層）。 若采用的是 layer.open({type: 1}) 方式調用，則type為必填項（信息框除外）

2、title - 標題

類型：String/Array/Boolean，默認：'信息'

title支持三種類型的值，

若傳入的是普通的字符串，如title :'我是標題'，那么只會改變標題文本；

若還需要自定義標題區域樣式，那么可以寫title: ['文本', 'font-size:18px;']，數組第二項可以寫任意css樣式；

若不想顯示標題欄，可以t寫 title: false

3、content - 內容

       類型：String/DOM/Array，默認：''

       content可傳入的值是靈活多變的，不僅可以傳入普通的html內容，還可以指定DOM，更可以隨着type的不同而不同。比如：

/!*
 如果是頁面層
 */
layer.open({
  type: 1, 
  content: '傳入任意的文本或html' //這里content是一個普通的String
});
layer.open({
  type: 1,
  content: $('#id') //這里content是一個DOM，注意：最好該元素要存放在body最外層，否則可能被其它的相對元素所影響
});
//Ajax獲取
$.post('url', {}, function(str){
  layer.open({
    type: 1,
    content: str //注意，如果str是object，那么需要字符拼接。
  });
});
/!*
 如果是iframe層
 */
layer.open({
  type: 2, 
  content: 'http://sentsin.com' //這里content是一個URL，如果你不想讓iframe出現滾動條，你還可以content: ['http://sentsin.com', 'no']
}); 
/!*
 如果是用layer.open執行tips層
 */
layer.open({
  type: 4,
  content: ['內容', '#id'] //數組第二項即吸附元素選擇器或者DOM
});        

 

4、area - 寬高

類型：String/Array，默認：'auto'

在默認狀態下，layer是寬高都自適應的，但當你只想定義寬度時，可以area: '500px'，高度仍然是自適應的。當你寬高都要定義時，可以area: ['500px', '300px']

5、maxWidth - 最大寬度

類型：，默認：360

請注意：只有當area: 'auto'時，maxWidth的設定才有效。