惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

WordPress大学
WordPress大学
B
Blog RSS Feed
The GitHub Blog
The GitHub Blog
爱范儿
爱范儿
博
博客园 - 司徒正美
J
Java Code Geeks
酷 壳 – CoolShell
酷 壳 – CoolShell
Engineering at Meta
Engineering at Meta
大猫的无限游戏
大猫的无限游戏
D
Docker
Blog — PlanetScale
Blog — PlanetScale
Recent Announcements
Recent Announcements
罗
罗磊的独立博客
Microsoft Azure Blog
Microsoft Azure Blog
博
博客园 - 聂微东
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
人人都是产品经理
人人都是产品经理
Stack Overflow Blog
Stack Overflow Blog
M
MIT News - Artificial intelligence
腾
腾讯CDC
T
The Blog of Author Tim Ferriss
小众软件
小众软件
U
Unit 42
T
Tailwind CSS Blog

博客园 - shcity

Troubleshooting on TransactionScope Parse string to JSON object Parse date in js blockUI doesn't close when download file in asp.net define namespace in JS Dense_Rank(), Row_Number(), Rank() in sql server reading and writing variable through lock in SSIS script task Fix the issue that cannot open SSIS in BIDS three ways creating custom helpers to show RadioButtonList in MVC using JavaScriptSerializer to serialize object to json using ISerializable to control serialization and deserialization ViewStateAutoManager ReportingService formatting Build my own DataTable split a string into an array through comma div with separated html template - shcity 正则表达式替换日期 foreach 的自动转化类型 在Ajax1.0中调用页面CS文件中的方法
半透明的div对话框
shcity · 2007-12-18 · via 博客园 - shcity

源码:

<!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>
    <title></title>

    <script type="text/javascript">

function MessageBox(){} 
MessageBox.alert = MessageBox$alert;
MessageBox.confirm = MessageBox$confirm;
MessageBox.create = MessageBox$create;
MessageBox.setSize = MessageBox$setSize;
MessageBox.close = MessageBox$close;

MessageBox.divConfig= {'id':'div1','bgColor':'green','zIndex':1000};  
MessageBox.tableConfig= 
{
    'id':'table1',
    'bgColor':'white',
    'width':'250px',
    'height':'100px',
    'borderColor':'lightblue',
    'titlebgColor':'aliceblue'
};

function MessageBox$alert( message ,callBack )
{
    MessageBox.create( message );
    var btn = document.createElement('input');
    btn.type = 'button';
    btn.value = '确定';
    if( callBack != null )
    {
        btn.attachEvent('onclick',function(){MessageBox.close();callBack();});
    }
    else    
    {
        btn.attachEvent('onclick',function(){MessageBox.close();});
    }
    
    var table = document.getElementById(MessageBox.tableConfig['id']);   
    table.rows[2].cells[0].innerHTML = '';
    table.rows[2].cells[0].appendChild(btn);
}

function MessageBox$confirm( message,callBack )
{
    MessageBox.create( message );
        
    var btnOK = document.createElement('input');
    btnOK.type = 'button';
    btnOK.value = '确定';
    btnOK.style.marginRight = '10px';
    if( callBack != null )
    {
        btnOK.attachEvent('onclick',function(){MessageBox.close();callBack( true );});
    }
    else    
    {
        btnOK.attachEvent('onclick',function(){MessageBox.close();});
    }  
    
    var btnCANCEL = document.createElement('input');
    btnCANCEL.type = 'button';
    btnCANCEL.value = '取消';
    if( callBack != null )
    {
        btnCANCEL.attachEvent('onclick',function(){MessageBox.close();callBack( false );});
    }
    else    
    {
        btnCANCEL.attachEvent('onclick',function(){MessageBox.close();});
    }
    
    var table = document.getElementById(MessageBox.tableConfig['id']);
    table.rows[2].cells[0].innerHTML = '';
    table.rows[2].cells[0].appendChild(btnOK);
    table.rows[2].cells[0].appendChild(btnCANCEL);
}

function MessageBox$create( message )
{
    var divId = MessageBox.divConfig['id'];
    var tableId = MessageBox.tableConfig['id'];
    var div = document.getElementById( divId );
    var table = document.getElementById(tableId);
    var divConfig = MessageBox.divConfig;
    var tableConfig = MessageBox.tableConfig;
    
    if( div == null )
    {
        div = document.createElement('<div style="filter:alpha(opacity=40);position:absolute;top:0px;left:0px;"></div>');
        div.id = divId;
        div.style.backgroundColor = divConfig['bgColor'];
        div.style.zIndex = divConfig['zIndex'];
        
        document.body.appendChild( div );
        
        var frame = document.createElement('<iframe style="filter:alpha(opacity=0);position:absolute;left:0px; top:0px; border-style:none;width:100%;height:100%;"></iframe>');
        frame.style.zIndex = divConfig['zIndex']-1;
        div.appendChild( frame );
        
        var contentH = parseFloat( tableConfig['height'] ) - 50;
        var strHTML = '<table id="'+tableId+'" style="position: absolute; filter : progid:DXImageTransform.Microsoft.DropShadow(color=#666666,offX=3,offY=3,positives=true);font-size:12px; border: '+ tableConfig['borderColor'] +' 1px solid; " cellpadding="2" cellspacing="0">'
            +'<tr>'
            +    '<td style="height:20px; background-color: '+tableConfig['titlebgColor']+';">提示信息'
            +    '</td>'
            +'</tr>'
            +'<tr>'
            +    '<td style="height:'+contentH+'px;text-align:center;word-break:break-all;">'
            +    '</td>'
            +'</tr>'
            +'<tr>'
            +    '<td style="height:30px;text-align:center;">'           
            +'</tr>'
            +'</table>';
        
        document.body.insertAdjacentHTML('afterBegin',strHTML);
        
        table = document.getElementById( tableId ); 
        table.style.backgroundColor = tableConfig['bgColor'];
        table.style.width = tableConfig['width'];
        table.style.height = tableConfig['height'];
        table.style.zIndex = divConfig['zIndex'] + 1;       
 
    }
    
    div.style.display = '';  
    table.style.display = '';
    
    table.rows[1].cells[0].innerHTML = message;    
    
    MessageBox.setSize(div,table); 
    
    window.attachEvent("onresize", function(){ MessageBox.setSize(div,table) } );  
    window.attachEvent("onscroll", function(){ MessageBox.setSize(div,table) } ); 
    
}

function MessageBox$setSize(div,table)
{    
    var sw = parseFloat(document.documentElement.scrollWidth);
    var cw = parseFloat(document.documentElement.clientWidth);
    var sh = parseFloat(document.documentElement.scrollHeight);
    var ch = parseFloat(document.documentElement.clientHeight);    
    
    div.style.width = sw >= cw?sw:cw;    
    div.style.height= sh >= ch?sh:ch;    
    
    table.style.left = parseFloat(document.documentElement.scrollLeft) +  cw/2 -  parseFloat(table.clientWidth)/2;
    table.style.top = parseFloat(document.documentElement.scrollTop) +  ch/2 -  parseFloat(table.clientHeight)/2;
}

function MessageBox$close()
{
    document.getElementById(MessageBox.tableConfig['id']).style.display = 'none';
    document.getElementById(MessageBox.divConfig['id']).style.display = 'none';  
}


//==============================================================================================================
function t()
{
   MessageBox.confirm('are you exit?',h);
}

function h( r )
{
   alert('你选的结果是:' + r );
}
    </script>

</head>
<body >

    <form id="id" action="">
        <button id="btn" onclick="MessageBox.alert('hello world!',function(){alert('你点我了')});">
            Click Me</button>
        <input id="Button1" type="button" value="Click Me" onclick="t()" />
        <select id="Select1">
            <option selected="selected"></option>
        </select>
        asdfasd       

    </form>
</body>
</html>

此内容由惯性聚合(RSS阅读器)自动聚合整理，仅供阅读参考。 原文来自 — 版权归原作者所有。