<p>在<strong>webForm</strong>弹出对话框是一件比较麻烦的事情,一般是借用js插件,js库来完成的,
<br />其实有一种既简单又好用的方法,那就是用div 弹出对方框</p>
<p> 下面我们就来详细介绍</p>
代码如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DIVDialog.aspx.cs" Inherits="DIVDialog" %>
<!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>
<script type="text/javascript" language ="javascript" src="Scripts/jquery-1.4.1.min.js" ></script>
<script type="text/javascript" language="javascript">
function messagebox_show1(div, msg, width) {
$DIV = $("#" + div).css({ top: "100px", left: "10%", width: "200px" });
$DIV.html(msg);
$DIV.show();
//$DIV.slideUp("slow");
}
function dialog() {
messagebox_show1("MsgDiv2", "div弹出对方框", "200");
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div>
<p>在<strong>webForm</strong>弹出对话框是一件比较麻烦的事情,一般是借用js插件,js库来完成的,
<br />其实有一种既简单又好用的方法,那就是用div 弹出对方框</p>
<input type="button" value="试一试" onclick="dialog();" id="btn_dialog"/>
<div id="MsgDiv2" style="display: none; z-index: 28; width: 150px; position: absolute;
height: 30px; background-color: #FFFFCC; border: #6ABAE5 solid 1px; font-size: 25px;
font-weight: bold; color: #ff0000; text-align: center;">
</div>
</div>
</div>
</form>
</body>
</html>
效果如下: