已经做好的背景变灰，弹出个性对话框。

IE和Firefox的DOM模型有所不同，因此应该区别对待。例子http://www.google.cn/search?complete=1&hl=zh-CN&newwindow=1&q=IE%E5%92%8CFireFox%E4%B8%AD%E5%B1%82%E7%9A%84%E6%8B%96%E5%8A%A8%E8%AF%A6%E8%A7%A3+&btnG=Google+%E6%90%9C%E7%B4%A2&meta=另外，需要参考 Firefox 开发人员参考http://developer.mozilla.org/

尤其是 Web Development 的参考http://developer.mozilla.org/en/docs/Web_Development如不能解决再说

钻石真好看http://www.aspstat.com/jbox/demo.htm

我看过了它们的区别，但还是找不到问题所在。我也看过IE与FireFox的兼容性问题及解决

装个FireBug调试一下就知道了。

<!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>Josh - Test</title>
        <style type="text/css">
            .opaqueLayer
            {
                display:none;
                position:absolute;
                top:0px;
                left:0px;
                opacity:0.6;
                filter:alpha(opacity=60);
                background-color: #000000;
                z-Index:1000;
            }

            .questionLayer
            {
                position:absolute;
                top:0px;
                left:0px;
                width:350px;
                height:200px;
                display:none;
                z-Index:1001;
                border:2px solid black;
                background-color:#FFFFFF;
                text-align:center;
                vertical-align:middle;
                padding:10px;
            }
        </style>
        <script type="text/javascript">
            function getBrowserHeight() {
                var intH = 0;
                var intW = 0;

                if(typeof window.innerWidth  == 'number' ) {
                   intH = window.innerHeight;
                   intW = window.innerWidth;
                }
                else if(document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
                    intH = document.documentElement.clientHeight;
                    intW = document.documentElement.clientWidth;
                }
                else if(document.body && (document.body.clientWidth || document.body.clientHeight)) {
                    intH = document.body.clientHeight;
                    intW = document.body.clientWidth;
                }                return { width: parseInt(intW), height: parseInt(intH) };
            }              function setLayerPosition() {
                var shadow = document.getElementById('shadow');
                var question = document.getElementById('question');                var bws = getBrowserHeight();
                shadow.style.width = bws.width + 'px';
                shadow.style.height = bws.height + 'px';                question.style.left = parseInt((bws.width - 350) / 2);
                question.style.top = parseInt((bws.height - 200) / 2);                shadow = null;
                question = null;
            }            function showLayer() {
                setLayerPosition();                var shadow = document.getElementById('shadow');
                var question = document.getElementById('question');

                shadow.style.display = 'block';
                question.style.display = 'block';                shadow = null;
                question = null;
            }

            function hideLayer() {
                var shadow = document.getElementById('shadow');
                var question = document.getElementById('question');

                shadow.style.display = 'none';
                question.style.display = 'none';                shadow = null;
                question = null;
            }            window.onresize = setLayerPosition;
        </script>
    </head>
    <body>
        <div id="shadow" class="opaqueLayer"> </div>
        <div id="question" class="questionLayer">
            <br />
            <br />
            <br />
            We can put anything in here
            <br />
            <br />
            <br />
            <input type="button" onclick="hideLayer();" value="Close" />
        </div>
        <h3>Modal Layer Test</h3>
        <p>Click the image below to display the "modal" layer</p>
        <img src="http://www.google.com/intl/en_ALL/images/logo.gif" alt="Test Image" onclick="showLayer();" />
    </body>
</html>

看看我这个在firefox下是否有变形,呵呵.http://219.153.19.88:8800/cs+js+css.

给你的链接你看了吗？不同的浏览器编程方法是不同的，比如设置样式需要加+"px"
    TreeAlertMsg$('TreeOverlayBackgroundDiv').style.height = iTree_Alert_pageHeight + "px";

    var sClientWidth = document.documentElement.clientWidth;
    var sWidth  = document.body.clientWidth;
    if(sWidth < sClientWidth)
    {
        TreeAlertMsg$('TreeOverlayBackgroundDiv').style.width = sClientWidth + "px";
        iTree_Alert_MoveMaxWidth = sClientWidth - 398 + "px";
    }
    else if(sWidth == sClientWidth)
    {
        TreeAlertMsg$('TreeOverlayBackgroundDiv').style.width = sClientWidth + "px";
        iTree_Alert_scrollwidth = parseInt(document.documentElement.offsetWidth) - parseInt(document.body.clientWidth) + "px";
        iTree_Alert_MoveMaxWidth = parseInt(document.documentElement.offsetWidth) - iTree_Alert_scrollwidth - 398 + "px";
    }
    else
    {
        TreeAlertMsg$('TreeOverlayBackgroundDiv').style.width = sWidth + "px";
        iTree_Alert_MoveMaxWidth = parseInt(sWidth)- 398 + "px";
    }再比如：
function TreeAlertMsgmoveStart(oEvent)
{
  if(!oEvent) oEvent = window.event另外。CSS里面不能写js代码的
      writer.WriteLine("  .TreeAlertMsgHeadTableCss {");
      writer.WriteLine("      -moz-user-select:none; ");
      writer.WriteLine("  }");另外，生成的代码最好换行
writer.WriteLine或者  writer.Write("<style type='text/css'>" + Environment.NewLine); 而不是writer.Write下面是不同浏览工作的拖放代码。学学别人怎么写的<html>
<head>
<title> Drag Demo 1 </title>
<style type="text/css">

</style>
<script type="text/javascript">

</script>
</head><body>
<div id="drag">drag me<div>
</body>
</html>

这是以前留得<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<HTML xmlns="http://www.w3.org/1999/xhtml" xml:lang="zn"><HEAD><TITLE>浮动层居中的对话框效果演示</TITLE>
<META http-equiv=content-type content="application/xhtml+xml; charset=gb2312">
<STYLE type=text/css>HTML {
HEIGHT: 100%
}
BODY {
HEIGHT: 100%
}
BODY {
FONT-SIZE: 14px; FONT-FAMILY: Tahoma, Verdana, sans-serif
}
DIV.neat-dialog-cont {
Z-INDEX: 98; BACKGROUND: none transparent scroll repeat 0% 0%; LEFT: 0px; WIDTH: 100%; POSITION: absolute; TOP: 0px; HEIGHT: 100%
}
DIV.neat-dialog-bg {
Z-INDEX: -1; FILTER: alpha(opacity=70); LEFT: 0px; WIDTH: 100%; POSITION: absolute; TOP: 0px; HEIGHT: 100%; BACKGROUND-COLOR: #eee; opacity: 0.7
}
DIV.neat-dialog {
BORDER-RIGHT: #444 1px solid; BORDER-TOP: #444 1px solid; Z-INDEX: 99; MARGIN-LEFT: auto; BORDER-LEFT: #444 1px solid; WIDTH: 30%; MARGIN-RIGHT: auto; BORDER-BOTTOM: #444 1px solid; POSITION: relative; TOP: 25%; BACKGROUND-COLOR: #fff
}
DIV.neat-dialog-title {
PADDING-RIGHT: 0.3em; PADDING-LEFT: 0.3em; FONT-SIZE: 0.8em; PADDING-BOTTOM: 0.1em; MARGIN: 0px; LINE-HEIGHT: 1.2em; PADDING-TOP: 0.1em; BORDER-BOTTOM: #444 1px solid; POSITION: relative
}
IMG.nd-cancel {
RIGHT: 0.2em; POSITION: absolute; TOP: 0.2em
}
DIV.neat-dialog P {
PADDING-RIGHT: 0.2em; PADDING-LEFT: 0.2em; PADDING-BOTTOM: 0.2em; PADDING-TOP: 0.2em; TEXT-ALIGN: center
}
</STYLE><SCRIPT type=text/javascript>
function NeatDialog(sHTML, sTitle, bCancel)
{
  window.neatDialog = null;
  this.elt = null;
  if (document.createElement  &&  document.getElementById)
  {
    var dg = document.createElement("div");
    dg.className = "neat-dialog";
    if (sTitle)
      sHTML = '<div class="neat-dialog-title">'+sTitle+
              ((bCancel)?
                '<img src="x.gif" alt="Cancel" class="nd-cancel" />':'')+
                '</div>\n' + sHTML;
    dg.innerHTML = sHTML;    var dbg = document.createElement("div");
    dbg.id = "nd-bdg";
    dbg.className = "neat-dialog-bg";    var dgc = document.createElement("div");
    dgc.className = "neat-dialog-cont";
    dgc.appendChild(dbg);
    dgc.appendChild(dg);    //adjust positioning if body has a margin
    if (document.body.offsetLeft > 0)
      dgc.style.marginLeft = document.body.offsetLeft + "px";    document.body.appendChild(dgc);
    if (bCancel) document.getElementById("nd-cancel").onclick = function()
    {
      window.neatDialog.close();
    };
    this.elt = dgc;
    window.neatDialog = this;
  }
}
NeatDialog.prototype.close = function()
{
  if (this.elt)
  {
    this.elt.style.display = "none";
    this.elt.parentNode.removeChild(this.elt);
  }
  window.neatDialog = null;
}function openDialog()
  {var sHTML = '<p>阿里西西WEB开发脚本特效集演示中心，阿里西西<a href="http://www.alixixi.com">www.alixixi.com</a>国内最大的WEB开发资源社区！</p>'+
      '<p><button onclick="window.neatDialog.close()">关闭!</button></p>';
    new NeatDialog(sHTML, "欢迎光临!", false);

}

</SCRIPT><META content="MSHTML 6.00.6000.16544" name=GENERATOR></HEAD>
<BODY>
<H1>浮动层居中的对话框效果演示</H1><BUTTON onclick=openDialog()>演示层提示效果</BUTTON></BODY></HTML>

修改方法：TreeAlertMsg.js文件
var iTree_Alert_MoveMaxHeight=0;
var iTree_Alert_MoveMaxWidth=0;
var iTree_Alert_scrolltop = 0;
var iTree_Alert_scrollleft = 0;
var iTree_Alert_pageHeight = 0;
var iTree_Alert_scrollwidth=0;///////pageloadshowMsg
window.onload = function ()
{
    iTree_Alert_pageHeight=document.body.clientHeight;
    iTree_Alert_pageHeight = document.documentElement.clientHeight>iTree_Alert_pageHeight?document.documentElement.clientHeight: iTree_Alert_pageHeight;

    if(TreeAlertMsg$('TreeOverlayBackgroundDiv')['style']['display']=="block")
    {
        TreeAlertMsg$('TreeOverlayBackgroundDiv').style.top=0;
        TreeAlertMsg$('TreeOverlayBackgroundDiv').style.height = iTree_Alert_pageHeight + "px";
        iTree_Alert_MoveMaxHeight = iTree_Alert_pageHeight - parseInt(TreeAlertMsg$('TreeAlertMsgDiv').offsetHeight);

        var sClientWidth = document.documentElement.clientWidth;
        var sWidth  = document.body.clientWidth;

        if(sClientWidth < sWidth)
        {
            iTree_Alert_scrollwidth = parseInt(document.documentElement.scrollWidth) - parseInt(document.body.clientWidth);
            iTree_Alert_MoveMaxWidth = parseInt(sWidth) - iTree_Alert_scrollwidth - parseInt(TreeAlertMsg$('TreeAlertMsgDiv').offsetWidth);
        }
        else if(sClientWidth == sWidth)
        {
            iTree_Alert_MoveMaxWidth = parseInt(document.documentElement.offsetWidth) - iTree_Alert_scrollwidth - parseInt(TreeAlertMsg$('TreeAlertMsgDiv').offsetWidth);
        }
    }
}
/*ShowPage*/
function TreeAlertMsgShowMsg(_sMsg)
{
    TreeAlertMsg$('TreeOverlayBackgroundDiv').style.height = iTree_Alert_pageHeight + "px";

    var sClientWidth = document.documentElement.clientWidth;
    var sWidth  = document.body.clientWidth;
    if(sWidth < sClientWidth)
    {
        TreeAlertMsg$('TreeOverlayBackgroundDiv').style.width = sClientWidth + "px";
        iTree_Alert_MoveMaxWidth = sClientWidth - 398 + "px";
    }
    else if(sWidth == sClientWidth)
    {
        TreeAlertMsg$('TreeOverlayBackgroundDiv').style.width = sClientWidth + "px";
        iTree_Alert_scrollwidth = parseInt(document.documentElement.offsetWidth) - parseInt(document.body.clientWidth) + "px";
        iTree_Alert_MoveMaxWidth = parseInt(document.documentElement.offsetWidth) - iTree_Alert_scrollwidth - 398 + "px";
    }
    else
    {
        TreeAlertMsg$('TreeOverlayBackgroundDiv').style.width = sWidth + "px";
        iTree_Alert_MoveMaxWidth = parseInt(sWidth)- 398 + "px";
    }

    TreeAlertMsg$('TreeAlertMsgTable_Table_MsgTd').innerText = _sMsg;

    var selectControls = document.getElementsByTagName("select");
    for(var i=0;i<selectControls.length;i++)
    {
        selectControls[i]['style']['visibility']="hidden";
    }    TreeAlertMsg$('TreeOverlayBackgroundDiv')['style']['display']="block";
    TreeAlertMsg$('TreeAlertMsgDiv')['style']['display']="block";
    TreeAlertMsgmiddle("TreeAlertMsgDiv");

    iTree_Alert_scrolltop = parseInt(document.body.scrollTop);
    iTree_Alert_scrollleft = parseInt(document.body.scrollLeft);
}/*HiddenMsg*/
function TreeAlertMsgHiddenMsg()
{
    TreeAlertMsg$('TreeOverlayBackgroundDiv')['style']['display']="none";
    TreeAlertMsg$('TreeAlertMsgDiv')['style']['display']="none";

    window.onscroll = null;

    var selectControls = document.getElementsByTagName("select");
    for(var i=0;i<selectControls.length;i++)
    {
        selectControls[i]['style']['visibility']="visible";
    }
}

文件续：/*window.onscroll*/
function TreeAlertMsgOnscroll()
{
    var   t   =   document.body.scrollTop;
    var   l   =   document.body.scrollLeft;
    var oAlertMsgDiv = TreeAlertMsg$('TreeAlertMsgDiv');

    oAlertMsgDiv.style.top = parseInt(oAlertMsgDiv.style.top) + (t - iTree_Alert_scrolltop) + "px";
    oAlertMsgDiv.style.left = parseInt(oAlertMsgDiv.style.top) + (l - iTree_Alert_scrollleft) + "px";
}/*Msgmiddle*/
function TreeAlertMsgmiddle(_sId)
{
var sClientWidth = document.documentElement.clientWidth;
var sClientHeight = document.documentElement.clientHeight;

var sScrollTop = document.documentElement.scrollTop;

TreeAlertMsg$(_sId)['style']['position'] = "absolute";
TreeAlertMsg$(_sId)['style']['left'] = (document.documentElement.clientWidth / 2) - 398/2  + "px";
var sTop = (sClientHeight / 2) - 206 / 2;

TreeAlertMsg$(_sId)['style']['top'] = sTop > 0 ? sTop + "px" : (sClientHeight / 2 + sScrollTop) - 206 / 2 + "px";
}/*GetObject*/
function TreeAlertMsg$(_sId)
{
    var oControls = document.getElementById(_sId);
    return oControls
}/*windowSizeChange*/
window.onresize=function TreeAlertMsgSize()
{
    if(TreeAlertMsg$('TreeOverlayBackgroundDiv')['style']['display']=="block")
    {
        var oTreeAlertMsg = TreeAlertMsg$("TreeAlertMsgDiv");

        TreeAlertMsg$('TreeOverlayBackgroundDiv').style.height = iTree_Alert_pageHeight + "px";
        iTree_Alert_MoveMaxHeight = iTree_Alert_pageHeight - parseInt(oTreeAlertMsg.offsetHeight) + "px";

        var sClientWidth = document.documentElement.clientWidth;
        var sWidth  = document.body.clientWidth;

        if(sWidth < sClientWidth)
        {
            TreeAlertMsg$('TreeOverlayBackgroundDiv').style.width = sClientWidth + "px";
            iTree_Alert_MoveMaxWidth = sClientWidth - parseInt(oTreeAlertMsg.offsetWidth) + "px";
        }
        else
        {
            TreeAlertMsg$('TreeOverlayBackgroundDiv').style.width = sWidth-iTree_Alert_scrollwidth + "px";
            iTree_Alert_MoveMaxWidth = sWidth-iTree_Alert_scrollwidth - parseInt(oTreeAlertMsg.offsetWidth) + "px";
        }
        TreeAlertMsgmiddle('TreeAlertMsgDiv');
    }
}var iTree_Alert_excursionX = 0;
var iTree_Alert_excursionY = 0;
/*MoveTreeAlertMsg*/
function TreeAlertMsgmoveStart(oEvent)
{
        if(!oEvent) oEvent = window.event
        var oTreeAlertMsg = TreeAlertMsg$('TreeAlertMsgDiv');

        var oTreeAlertMsgTop = TreeAlertMsg$('TreeAlertMsgDiv').style.top;
        var oTreeAlertMsgLeft = TreeAlertMsg$('TreeAlertMsgDiv').style.left;

        var tempx = oEvent.clientX + document.body.scrollLeft;
        var tempy = oEvent.clientY + document.body.scrollTop;

        iTree_Alert_excursionX = parseInt(tempx) - parseInt(oTreeAlertMsgLeft);
        iTree_Alert_excursionY = parseInt(tempy) - parseInt(oTreeAlertMsgTop);
        if(oTreeAlertMsg.setCapture)
  oTreeAlertMsg.setCapture();
    else if(window.captureEvents)
  window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP);        oTreeAlertMsg.onmousemove = TreeAlertMsgmousemove;
        oTreeAlertMsg.onmouseup = TreeAlertMsgMouseup;
}function TreeAlertMsgmousemove(oEvent)
{    if(!oEvent) oEvent = window.event
    var tempmousex = oEvent.clientX + document.body.scrollLeft;
    var tempmousey = oEvent.clientY + document.body.scrollTop;

    TreeAlertMsg$("TreeAlertMsgDiv").style.top = parseInt(tempmousey) - iTree_Alert_excursionY + "px";
    TreeAlertMsg$("TreeAlertMsgDiv").style.left = parseInt(tempmousex) - iTree_Alert_excursionX + "px";
}
function TreeAlertMsgMouseup(oEvent)
{
    var oTreeAlertMsg = TreeAlertMsg$("TreeAlertMsgDiv");
    var iAlertMsgTop = parseInt(oTreeAlertMsg.style.top);
    var iAlertMsgLeft = parseInt(oTreeAlertMsg.style.left);

    if(iAlertMsgTop < 0)
    {
        oTreeAlertMsg.style.top = 0;
    }
    else if(iAlertMsgTop > iTree_Alert_MoveMaxHeight-2)
    {
        oTreeAlertMsg.style.top = iTree_Alert_MoveMaxHeight-2 + "px";
    }

    if(iAlertMsgLeft < 0 )
    {
        oTreeAlertMsg.style.left = 0;
    }
    else if(iAlertMsgLeft > iTree_Alert_MoveMaxWidth)
    {
        oTreeAlertMsg.style.left = iTree_Alert_MoveMaxWidth + "px";
    }

     if(oTreeAlertMsg.releaseCapture)
  oTreeAlertMsg.releaseCapture();
    else if(window.captureEvents)
  window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP);

    oTreeAlertMsg.onmousemove = null;
    oTreeAlertMsg.onmouseup = null;
}

AlertMsg.cs文件部分修改
writer.WriteLine("<style type='text/css'>");
writer.WriteLine("   .TreeAlertMsgbt_mouseout {" );
writer.WriteLine("       BORDER-RIGHT: #2C59AA 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #2C59AA 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#C3DAF5); BORDER-LEFT: #2C59AA 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #2C59AA 1px solid;");
writer.WriteLine("   }");
writer.WriteLine("   .TreeAlertMsgbt_mouseover {");
writer.WriteLine("       BORDER-RIGHT: #2C59AA 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #2C59AA 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#D7E7FA); BORDER-LEFT: #2C59AA 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #2C59AA 1px solid;");
writer.WriteLine("   }");
writer.WriteLine("   .TreeAlertMsgbt_mousedown {");
writer.WriteLine("       BORDER-RIGHT: #FFE400 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #FFE400 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#C3DAF5); BORDER-LEFT: #FFE400 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #FFE400 1px solid;");
writer.WriteLine("   }");
writer.WriteLine("   .TreeAlertMsgbt_mouseup {");
writer.WriteLine("       BORDER-RIGHT: #2C59AA 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #2C59AA 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px; FILTER: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#C3DAF5); BORDER-LEFT: #2C59AA 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #2C59AA 1px solid;");
writer.WriteLine("   }");
writer.WriteLine("  .TreeOverlayBackgroundDivCss {");
writer.WriteLine("      display: none;position: absolute; top: 0px; margin: 0px; left: 0px; background: " + sOverlayBackColor + ";  z-index: " + iBackColorz_index.ToString() + ";");
writer.WriteLine("  }");
writer.WriteLine("  .TreeAlertMsgDivCss {");
writer.WriteLine("      display: none;position: absolute;width:398px;z-index: " + (iBackColorz_index + 1).ToString() + ";height:206px;");
writer.WriteLine("  }");
writer.WriteLine("  .TreeAlertMsgTableCss {");
writer.WriteLine("      border: 1px solid #000000;position: absolute;");
writer.WriteLine("  }");
writer.WriteLine("  .TreeAlertMsgHeadTdCss {");
if (sAlertMsgHeadImgUrl == string.Empty)
{
  writer.WriteLine("      background: url(" + this.Page.ClientScript.GetWebResourceUrl(this.GetType(), "TreeControls.App_Themes.tit_dialog.gif") + ") repeat-x;");
}
else
{
  writer.WriteLine("      background: url(" + sAlertMsgHeadImgUrl + ") repeat-x;");
}
writer.WriteLine("  }");
writer.WriteLine("  .TreeAlertMsgHeadTableCss {");
writer.WriteLine("      -moz-user-select:none; ");
writer.WriteLine("  }");
writer.WriteLine("</style>");
以上代码在IE7,Firefox 2,Netscape 9.0上测试通过

钻石Very好看！

调试易

已经做好的背景变灰，弹出个性对话框。

解决方案 »