コンパクトで強力なjquery layer弾窓弾層プラグイン

まず公式サイトに行って最新のjsをダウンロードしますhttp://sentsin.com/jquery/layer/①引用jquery②引用layer.min.js
弾層をトリガするイベントは、次のように自由にバインドできます.

$('#id').on('click', function(){ 
  layer.msg('test'); 
}); 

次に、上記の例の呼び出しコードを主に貼り付けます.
【情報ボックス】:

layer.alert('           ', 8); //    
layer.msg('       '); //    
//  ，         。 
 

【質問ボックス】:

$.layer({ 
  shade: [0], 
  area: ['auto','auto'], 
  dialog: { 
    msg: '          ？', 
    btns: 2,           
    type: 4, 
    btn: ['  ','  '], 
    yes: function(){ 
      layer.msg('  ', 1, 1); 
    }, no: function(){ 
      layer.msg('  ', 1, 13); 
    } 
  } 
}); 
//   layer.confirm()     
 

【ページ層1】

$.layer({ 
  type: 1, 
  shade: [0], 
  area: ['auto', 'auto'], 
  title: false, 
  border: [0], 
  page: {dom : '.layer_notice'} 
}); 
 

【ページ層2】

var pageii = $.layer({ 
  type: 1, 
  title: false, 
  area: ['auto', 'auto'], 
  border: [0], //       
  shade: [0], //     
  closeBtn: [0, false], //         
  shift: 'left', //       
  page: { 
    html: '
     ，       。
  < /button>
' 
  } 
}); 
//     
$('#pagebtn').on('click', function(){ 
  layer.close(pageii); 
}); 
 

【iframe層一】

$.layer({ 
  type: 2, 
  shadeClose: true, 
  title: false, 
  closeBtn: [0, false], 
  shade: [0.8, '#000'], 
  border: [0], 
  offset: ['20px',''], 
  area: ['1000px', ($(window).height() - 50) +'px'], 
  iframe: {src: 'http://f2e.sentsin.com/chat'} 
});  
 

【iframe層2】

layer.tips('5           ，       iframe', this, { 
  time: 5, 
  maxWidth: 260 
}); 
$.layer({ 
  type: 2, 
  closeBtn: false, 
  shadeClose: true, 
  shade: [0.1, '#fff'], 
  border: [0], 
  time: 5, 
  iframe: { 
    src: 'test/guodu.html' 
  }, 
  title: false, 
  area: ['300px','250px'], 
  shift: 'right-bottom', 
  end: function(){ 
    $.layer({ 
      type : 2, 
      title: '     - sentsin.com', 
      shadeClose: true, 
      maxmin: true, 
      fix : false,  
      area: ['1024px', 500],            
      iframe: { 
        src : 'http://sentsin.com/' 
      }  
    }); 
  } 
}); 
 

【ロード層1】

layer.load(3); 
 

【ロード層2】

layer.load('     ', 3); 
 

【tips層一】

layer.tips('tips         ，       。', this, { 
  style: ['background-color:#78BA32; color:#fff', '#78BA32'], 
  maxWidth:185, 
  time: 3, 
  closeBtn:[0, true] 
}); 
 

【tips層2】

layer.tips('        ', this , {guide: 1, time: 2}); 
 

【入力/ファイル層】

//     
layer.prompt({title: '    ？'}, function(name){ 
  alert(name); 
}); 
//     
layer.prompt({title: '      ，   ',type: 1}, function(pass){ 
  alert(pass); 
}); 
//     
layer.prompt({title: '       ，   ',type: 2}, function(file){ 
  alert(file); 
}); 
//     
layer.prompt({title: '     ，   ',type: 3}, function(val){ 
  alert(val); 
}); 
 

【tab層】

layer.tab({ 
  area: ['1000px', '500px'], 
  data: [ 
    {title: 'Say', content:'Hi，Main'}, 
    {title: '  ', content:'  html  '}           
  ] 
}); 
 

【アルバム層】

//         ，   json  ，       。          photos.json 
var conf = {}; 
$.getJSON('ajax  ', {}, function(json){ 
  conf.photoJSON = json; //  json，             
  layer.photos({ 
    html: '        html，       （            ）。         、Esc  ', 
    json: json 
  }); 
});