DIY的JS弹出层弹出对话框弹出页面弹出窗口的插件

     今天要共享一款基于jQuery1.6的弹层插件lyz.layer1.0，该能在浏览器界面上显示非常好的体验效果，它可以通过配置不同属性来实现多样功能化，含：弹信息框、弹出层、弹窗口、弹出HTML代码等等。

    详细JS调用代码如下：

$(function () { $("#btnAlert").click(function () { // 弹出普通对话框 $.alert({ msg: "这是调用$.alert弹出信息" }); }); $("#btnRight").click(function () { // 弹出成功对话框 $.right(); }); $("#btnError").click(function () { // 弹出错误对话框 $.error(); }); $("#btnConfirm").click(function () { // 弹出询问对话框 $.confirm({ callback: function (result) { if (result) { alert("您选择了/"确定/""); } else { alert("您选择了/"取消/""); } } }); }); $("#btnContainer").click(function () { // 弹出现存在的层 $.container({ targetId: "#div1", width: 300, height: 200 }); }); $("#btnFrame").click(function () { // 弹出页面 $.frame({ pageUrl: "http://www.baidu.com/", width: 700, height: 500 }); }); $("#btnCustom").click(function () { // 弹出自定义HTML $.custom({ content: "<div style="text-align: center;" mce_style="text-align: center;">hello lyz!</div>", width: 150, height: 100 }); }); });

 

详细属性说明：

示例 最简洁的调用 备注 提示信息$.alert({ msg: "这是调用$.alert弹出信息" }); 专有属性：msg(可选)、callback(可选) 成功信息 $.right(); 专有属性：msg(可选)、callback(可选) 错误信息 $.error(); 专有属性：msg(可选)、callback(可选) 询问信息 $.confirm({ callback: function (result) { if (result) { alert("您选择了/"确定/""); } else { alert("您选择了/"取消/""); } } }); 专有属性：msg(可选)、callback(可选) 普通弹层 $.container({ targetId: "#div1", width: 300, height: 200 }); 专有属性：targetId(必选) iframe弹窗 $.frame({ pageUrl: "http://www.baidu.com/", width: 700, height: 500 }); 专有属性：pageUrl(必选) 自定义弹出 $.custom({ content: "<div style='text-align: center;'>hello lyz!</div>", width: 150, height: 100 }); 自定义调用

 

基本参数 说明 icon 弹出的标题图标(图标路径) title 弹出的标题文本 width 弹出的层的宽度(默认：0) height 弹出的层的高度(默认：0) 样式参数  background 遮罩层背景色(默认：#000(黑色)) opacity 透明度(0：完全透明；1：不透明，默认：0.5) duration 三种预定淡出(入)速度之一的字符串("slow", "normal", or "fast")或表示动画时长的毫秒数值(如：1000)，(默认:"normal") showTitle 是否显示标题(默认：true) dragOpacity drag为true时，拖动弹层时的透明度(默认：1(不透明)) 动作参数  escClose 是不可以按下“ESC”关闭(默认：true) masksClose 是否可以点击遮罩层关闭 (默认：false) drag 是否可以拖动弹层(暂不支持IE6，默认：false) 名称  CloseLayer(); 调用关闭弹层，一般用于弹出层内触发关闭调用(如果$.frame()里的页面内调用，则为：window.parent.CloseLayer();)

 

实例下载地址：http://download.csdn.net/source/3389694