javascript模仿msgbox提示效果代码


Posted in Javascript onJune 10, 2008
//前任作者:http://www.moozi.net 
//修改:hh13774978@126.com,rayking 
function $(str){ 
    return document.getElementById(str); 
} 
function _(str){ 
    return document.getElementsByTagName(str); 
} 
function msg(boxtitle,boxtype,boxwidth,msg,url){ 
    $("msg_div_main").style.width = boxwidth; 
    $("msg_div_main").style.left = (_("body")[0].clientWidth - boxwidth) / 2; 
    $("msg_div_main").style.top  = (_("body")[0].clientHeight - 220) / 2; 
    var msg_div_main_but_tmp = "<br /><br />" 
                + "<button class='msg_div_main_but' id='msg_div_main_but' " 
                + "onclick=\"msg_close_tmp_biyuan();" + url + "\">确 定</button>"; 
    switch(boxtype * 1){ 
        case 1: 
            $("msg_div_main_content").innerHTML = msg + msg_div_main_but_tmp; 
            //$("msg_div_main_but").focus(); 
        break; 
        case 2: 
            $("msg_div_main_content").innerHTML =  msg + msg_div_main_but_tmp 
                             + "  <button class='msg_div_main_but' " 
                             + "onclick='msg_close_tmp_biyuan();'>取 消</button>"; 
            //$("msg_div_main_but").focus(); 
        break; 
        case 3: 
            $("msg_div_main_content").innerHTML =  msg; 
        break; 
        defualt: 
            $("msg_div_main_content").innerHTML =  msg; 
        break; 
    } 
    $("msg_div_main_title").innerHTML =  boxtitle; 
    $("msg_div_main").style.zIndex = 200; 
    $("msg_div_main").style.display = ""; 
    if(document.all){    //IE 
            if(!$("msg_div_all_Iframe")) 
                { 
            document.body.appendChild(document.createElement("<iframe id='msg_div_all_Iframe' style='display:none;'></iframe>")); 
                } 
            $("msg_div_all").style.zIndex  = 100; 
            $("msg_div_all").style.display = ""; 
            $("msg_div_all").oncontextmenu = function() 
                { 
                        return false; 
                } 
            $("msg_div_all_Iframe").style.zIndex  = 99; 
            $("msg_div_all_Iframe").style.display = ""; 
            $("msg_div_all_Iframe").oncontextmenu = function() 
                { 
                        return false; 
                } 
        }else{ 
            $("msg_div_all").style.zIndex  = 100; 
            $("msg_div_all").style.display = ""; 
            $("msg_div_all").oncontextmenu = function() 
                { 
                        return false; 
                } 
        } 
    $("msg_div_main").oncontextmenu = function(){ 
        return false; 
    } 
} 
function msg_close_tmp_biyuan(){ 
    $('msg_div_all').style.display='none'; 
    $('msg_div_main').style.display='none'; 
    if(document.all){ 
    $('msg_div_all_Iframe').style.display='none';} 
} 
//加入对话框移动代码 
/* 鼠标拖动 */ 
var oDrag = ""; 
var ox,oy,nx,ny,dy,dx; 
function drag(e,o){ 
    var e = e ? e : event; 
    var mouseD = document.all ? 1 : 0; 
    if(e.button == mouseD) 
    { 
        if (o.parentNode) 
        { 
            oDrag = o.parentNode; 
        } 
        else{oDrag = o;} 
        ox = e.clientX; 
        oy = e.clientY;         
    } 
} 
function dragPro(e){ 
    if(oDrag != "") 
    {     
        //var obj=document.getElementById("msg");//拖动的id 
        var obj=oDrag;//拖动的id 
        var e = e ? e : event; 
        obj.style.position = 'absolute'; 
        dx = parseInt(obj.style.left); 
        dy = parseInt(obj.style.top); 
        if(isNaN(dx)){dx=0;} 
        if(isNaN(dy)){dy=0;} 
        nx = e.clientX; 
        ny = e.clientY; 
        obj.style.left = (dx + ( nx - ox )) + "px"; 
        obj.style.top = (dy + ( ny - oy )) + "px"; 
        ox = nx; 
        oy = ny; 
    } 
} 
document.onmouseup = function(){oDrag = "";} 
document.onmousemove = function(event){dragPro(event);} 
document.writeln("<style type='text/css'>" 
    + "#msg_div_all,#msg_div_all_Iframe{width:100%;height:100%;position:absolute;filter:Alpha(opacity=70);opacity:0.7;background:#EFEFEF;}" 
    + "#msg_div_main {position:absolute;}" 
    + "#msg_div_main_title {font-size:12px;color:#2C71AF;font-family:verdana;cursor:default;}" 
    + "#msg_div_main_content {font-size:14px;color:#2C71AF;padding-left:8px;}" 
    + ".msg_div_main_but {background:url(img/buttonbg.gif);width:65px;heigt:20px;border:none;padding-top:3px;font-size:12px;}" 
    + "</style>" 
    + "<div id='msg_div_all' style='display:none;'></div>" 
    +"" 
    + "<div id='msg_div_main' style='display:none;'>" 
    + "<table width='100%' height='29' border='0' cellspacing='0' cellpadding='0'  onmousedown='drag(event,this)'>" 
    + "<tr>" 
    + "<td width='25'><img src='img/bg_01.gif' width='25' height='29' alt='' /></td><td background='img/bg_02.gif' width='3'></td>" 
    + "<td background='img/bg_02.gif'  msg_forid='msg_div_main' id='msg_div_main_title'></td>" 
    + "<td background='img/bg_02.gif' align='right' style='padding-top:4px'>" 
    + "<img src='img/bg_05.gif' width='21' height='21' alt='关闭' " 
    + "onMouseover=\"this.src='img/bg_13.gif'\" " 
    + "onMouseout=\"this.src='img/bg_05.gif'\" onMouseup='msg_close_tmp_biyuan();' " 
    + "onMousedown=\"this.src='img/bg_18.gif'\"></td>" 
    + "<td width='6'><img src='img/bg_06.gif' width='6' height='29' alt='' /></td>" 
    + "</tr>" 
    + "</table>" 
    + "<table width='100%' border='0' cellspacing='0' cellpadding='0'>" 
    + "<tr>" 
    + "<td width='3' background='img/bg_07.gif'></td>" 
    + "<td bgcolor='#F7F7F7' align='center'><br /><span id='msg_div_main_content'></span><br /><br /></td>" 
    + "<td width='3' background='img/bg_08.gif'></td>" 
    + "</tr>" 
    + "<tr>" 
    + "<td width='3' height='3'><img src='img/bg_09.gif' width='3' height='3' alt='' /></td>" 
    + "<td background='img/bg_11.gif'></td>" 
    + "<td width='3' height='3'><img src='img/bg_10.gif' width='3' height='3' /></td>" 
    + "</tr>" 
    + "</table>" 
    + "</div>");

在线演示
打包下载
Javascript 相关文章推荐
js中escape对应的C#解码函数 UrlDecode
Dec 16 Javascript
详细介绍8款超实用JavaScript框架
Oct 25 Javascript
LABjs、RequireJS、SeaJS的区别
Mar 04 Javascript
JavaScript Serializer序列化时间处理示例
Jul 31 Javascript
JavaScript中的迭代器和生成器详解
Oct 29 Javascript
AngularJS Toaster使用详解
Feb 24 Javascript
AngularJS页面带参跳转及参数解析操作示例
Jun 28 Javascript
深入理解Vue 单向数据流的原理
Nov 09 Javascript
微信小程序定位当前城市的方法
Jul 19 Javascript
vue  自定义组件实现通讯录功能
Sep 30 Javascript
JavaScript原型对象原理与应用分析
Dec 27 Javascript
js代码实现轮播图
May 04 Javascript
javascript 建设银行登陆键盘
Jun 10 #Javascript
js left,right,mid函数
Jun 10 #Javascript
国外的为初学者写的JavaScript教程
Jun 09 #Javascript
使用jscript实现二进制读写脚本代码
Jun 09 #Javascript
JScript中使用ADODB.Stream判断文件编码的代码
Jun 09 #Javascript
javascript 数组的方法集合
Jun 05 #Javascript
js程序中美元符号$是什么
Jun 05 #Javascript
You might like
PHP生成sitemap.xml地图函数
2013/11/13 PHP
destoon供应信息title调用出公司名称的方法
2014/08/22 PHP
PHP获得数组交集与差集的方法
2015/06/10 PHP
为你总结一些php信息函数
2015/10/21 PHP
PHP给文字内容中的关键字进行套红处理
2016/04/12 PHP
Yii列表定义与使用分页方法小结(3种方法)
2016/07/15 PHP
需要做特殊处理的DOM元素属性的访问
2010/11/05 Javascript
js获取某月的最后一天日期的简单实例
2013/06/22 Javascript
JavaScript地图拖动功能SpryMap的简单实现
2013/07/17 Javascript
jquery统计复选框选中示例
2013/11/05 Javascript
JS中的log对象获取以及debug的写法介绍
2014/03/03 Javascript
超级简单的jquery操作表格方法
2014/12/15 Javascript
jQuery封装的tab选项卡插件分享
2015/06/16 Javascript
微信小程序 rich-text的使用方法
2017/08/04 Javascript
vue中for循环更改数据的实例代码(数据变化但页面数据未变)
2017/09/15 Javascript
JavaScript去掉数组重复项的方法分析【测试可用】
2018/07/19 Javascript
laydate时间日历插件使用方法详解
2018/11/14 Javascript
浅析vue插槽和作用域插槽的理解
2019/04/22 Javascript
javascript实现放大镜功能
2020/12/09 Javascript
js实现弹幕墙效果
2020/12/10 Javascript
[04:49]期待西雅图之战 2016国际邀请赛中国区预选赛WINGS战队赛后采访
2016/06/29 DOTA
python提取字典key列表的方法
2015/07/11 Python
在Django的视图(View)外使用Session的方法
2015/07/23 Python
Windows上使用Python增加或删除权限的方法
2018/04/24 Python
python3.7 的新特性详解
2019/07/25 Python
TensorFlow加载模型时出错的解决方式
2020/02/06 Python
快速解决jupyter启动卡死的问题
2020/04/10 Python
python 实现仿微信聊天时间格式化显示的代码
2020/04/17 Python
Python使用sys.exc_info()方法获取异常信息
2020/07/23 Python
Python中的流程控制详解
2021/02/18 Python
IE9对HTML5中部分属性不支持的原因分析
2014/10/15 HTML / CSS
EVE LOM英国官网:全世界最好的洁面膏
2017/10/30 全球购物
地理科学专业毕业生求职信
2013/10/15 职场文书
学生会干部自荐信
2014/02/04 职场文书
财务工作检讨书
2014/10/29 职场文书
Flask response响应的具体使用
2021/07/15 Python