artDIalog 弹出层
artDialog 先上图 让大家看看
直接复制代码进行测试
别忘了下载类库
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<!--下面的jquery类库和artDialog没关系-->
<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="artDialog3.0.4/artDialog.js" type="text/javascript"></script>
<link href="artDialog3.0.4/skin/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
function showdialog() {
art.dialog({
content: '欢迎使用artDialog对话框组件！',
drag: false,
//lock: true,//是否遮罩
yesFn: function() {
// this.follow('Button1').time(2); //定位 //限定时间显示
alert("你点击了确定");
return false;
},
noFn: function() {
art.dialog.alert("弹出警告框");
}
});
}
function loadPage() {
art.dialog.load("HTMLPage.htm",
{ title: "加载过去的内容",
lock: true,
drag: false,
width: "500px",
height: "80px",
yesFn: function() {
//$("#Button4").val(""); //和Jquey混用
alert("你点击了确定");
},
noFn: function() {
art.dialog.alert("你点击了取消按钮");
},
closeFn: function() {
art.dialog.tips("短暂提示框", 5)//临时提示
}
},
false
);
}
function share() {
var str = $("#Text1").val();
if (str =="") {
str = "您没有输入内容。。。。。。";
}
art.dialog({
content: str,
lock: true,
drag: false,
width: "300px",
height: "400px",
style:"overflower:auto",
yesFn: function() {
art.dialog({
content: "分享成功！",
time: 2,
left: "right",
top: "bottom",
lock:true
});
},
noFn: function() {
art.dialog.alert("Fuck U");
},
yesText:"分 享",
noText:"取 消"
});
}
</script>
<style type="text/css">
#Text1
{
height: 131px;
width: 525px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
1.<input id="Button1" type="button" onclick="showdialog()" value="普通测试" />
2.<input id="Button2" type="button" onclick="loadPage()" value="LoadPage" /><br />
<img src="artdialog%20default.jpg"/>
<hr />
<img src="artDialog%20ajax.jpg" /><br />
3.<br /> <fieldset style="border: solid 10px #3A6EA5">
<legend>人人分享 </legend>
<input id="Button3" type="button" onclick="share()" value="模仿人人分享" />
<input id="Text1" type="text" />
</fieldset>
</div>
</form>
</body>
</html>
