div 对话框

17 篇文章 1 订阅
6 篇文章 1 订阅

 <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="试一试"  οnclick="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>


效果如下:

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值