JDialog 弹出框，前端开发必备神器

77 阅读 0 评论 51 点赞

我是靠谱客的博主英勇绿草，最近开发中收集的这篇文章主要介绍JDialog 弹出框，前端开发必备神器，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

JDialog是一个简单易用但是功能强大的开源JS弹出窗口，具有很强的扩展性和兼容性，兼容IE6.0，目前版本1.2.
1. 包括锁屏对象JDialog.lock， 提示工具 JDialog.tip， 确认框 JDialog.confirm 弹出窗口 JDialog.win 比artDialog功能更强大，使用更方便。
2. JWindow 是一个做WebOS系统的必备工具，使用Jwindow搭建WebOs系统能为您节省大量的时间。
3. 提供9种优美的皮肤供你选择,总有一种适合你的.
废话不多说，直接看产品。
1.锁屏

JDialog.lock.work();

2.提示框

JDialog.tip.work({type:'ok', border:'1px solid #FFF', content : '恭喜您，注册成功，即将跳转至登录界面。'});
JDialog.tip.work({type:'error', border:'1px solid #F0F', content : '对不起，注册失败，请重试。'});
JDialog.tip.work({type:'loading', border:'1px solid #F0F', content : '正在努力加载数据，请稍后...'});
JDialog.tip.work({type:'warn', border:'1px solid #F0F', content : '用户名不能为空哦！'});

3. 弹出窗口

JDialog.win.work({
title:'HerosPHP弹出窗口',
content:"<div style='height:200px;'>这是窗口的内容</div>",
borderWidth:8,
skin : 'green',
//hasTitle : false,
//position : [100, 30],
callback:function() {JDialog.lock.hide();}
});

4. 确认框

JDialog.confirm.work({
title : '删除商品提示',
content : '该操作会删除所有的商品，继续操作吗？强烈建议您将其移动至其他栏目',
skin : 'purple',
width : 600,
shadow : true,	//是否需要阴影
icon : 'laugh',
button : {
'确认' : function() {
window.alert('很好，你同意了');
JDialog.confirm.hide();
},
'取消' : function() {
window.alert('fuck ,
你为什么要取消！！');
},
'不确定' : function() {
window.alert('shit, 你居然不确定！');
},
'很好' : function() {
window.alert('好什么好啊。SB');
}
}
});

5. WebOS

if($.browser.msie&&($.browser.version<="6.0")&&!$.support.style) {
AlphaPNG.fix('.task_item');
}
JTaskBar.init();	//初始化任务栏
function addWindow() {
//窗体配置
var config = {
//helper : 'resize_helper',
title : '红楼梦-百度应用',
content : document.getElementById('testdiv').innerHTML,
skin : 'lightwood',
width : 800,
height :300
};
var _t = new Task({
deskId : 1,
iconSrc : 'http://localhost/TEST/project/JDialog/img/mid.png'
}, config);
var _task = _t.getTask();
JTaskBar.addTask(_task);
//修复IE透明
if($.browser.msie&&($.browser.version<="6.0")&&!$.support.style) AlphaPNG.fixPng(document.getElementById('icon_'+(JTaskBar.taskId-1)));
}
addWindow();