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

推荐订阅源

Martin Fowler
Martin Fowler
WordPress大学
WordPress大学
S
SegmentFault 最新的问题
罗
罗磊的独立博客
Apple Machine Learning Research
Apple Machine Learning Research
The Cloudflare Blog
L
LangChain Blog
博
博客园 - 司徒正美
G
Google Developers Blog
博
博客园 - 【当耐特】
GbyAI
GbyAI
月光博客
月光博客
人人都是产品经理
人人都是产品经理
D
DataBreaches.Net
大猫的无限游戏
大猫的无限游戏
A
About on SuperTechFans
Microsoft Azure Blog
Microsoft Azure Blog
V
Visual Studio Blog
D
Docker
MongoDB | Blog
MongoDB | Blog
Vercel News
Vercel News
Stack Overflow Blog
Stack Overflow Blog
Jina AI
Jina AI
博
博客园 - 聂微东

博客园 - 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阅读器)自动聚合整理，仅供阅读参考。 原文来自 — 版权归原作者所有。