js 兼容问题

这段代码需要解决问题描述：
1、在最小化里面有这样一段：   var H = parseInt(tit.style.height); //最小化窗口的高度
那个H的值在IE7中能得到正确的值但是在IE8中怎么值是NaN,各样式也不能正常显示，是那里的设置有问题吗？
2、在最小化后再最大化的时候 如何使层还原到原来的位置。
2、这个弹出层中的内容：
也就是在 var a = new xWin("1", 160, 200, 200, 200, "窗口1", "xWin <br/> A Cool Pop Div Window<br/>Version:1.0<br/>2002-8-13");
 的时候如何使其中的能容具有扩展性，比如传个iframe 可以将iframe url 引用到或者
随便传什么都能加载进去，只要是页面能容呢？
3、如何使这代码和火狐等那些不是IE系列的浏览器兼容。  在次求教各位大虾了 ……<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="NewareSAP.Web.WebForm1" %><!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>_xWin</title> 
<style type='text/css'> 
<!-- 
body{font-size:12px;} 
a:visited{text-decoration:none;color:slategray;} 
a:hover{text-decoration:underline;color:slategray;} 
a:link{text-decoration:none;color:slategray;} 
--> 
</style> 
<script language=JScript> 
<!--
    //可以打包为js文件; 
    var x0 = 0, y0 = 0, x1 = 0, y1 = 0;
    var offx = 6, offy = 6;
    var moveable = false;
    var hover = 'orange', normal = '#336699'; //color; 
    var index = 10000; //z-index; 
    //开始拖动; 
    function startDrag(obj) {
        if (event.button == 1) {
            //锁定标题栏; 
            obj.setCapture();
            //定义对象; 
            var win = obj.parentNode;
            var sha = win.nextSibling;
            //记录鼠标和层位置; 
            x0 = event.clientX;
            y0 = event.clientY;
            x1 = parseInt(win.style.left);
            y1 = parseInt(win.style.top);
            //记录颜色; 
            normal = obj.style.backgroundColor;
            //改变风格; 
            obj.style.backgroundColor = hover;
            win.style.borderColor = hover;
            obj.nextSibling.style.color = hover;
            sha.style.left = x1 + offx;
            sha.style.top = y1 + offy;
            moveable = true;
        }
    }
    //拖动; 
    function drag(obj) {
        if (moveable) {
            var win = obj.parentNode;
            var sha = win.nextSibling;
            win.style.left = x1 + event.clientX - x0;
            win.style.top = y1 + event.clientY - y0;
            sha.style.left = parseInt(win.style.left) + offx;
            sha.style.top = parseInt(win.style.top) + offy;
        }
    }
    //停止拖动; 
    function stopDrag(obj) {
        if (moveable) {
            var win = obj.parentNode;
            var sha = win.nextSibling;
            var msg = obj.nextSibling;
            win.style.borderColor = normal;
            obj.style.backgroundColor = normal;
            msg.style.color = normal;
            sha.style.left = obj.parentNode.style.left;
            sha.style.top = obj.parentNode.style.top;
            obj.releaseCapture();
            moveable = false;
        }
    }
    //获得焦点; 
    function getFocus(obj) {
        if (obj.style.zIndex != index) {
            index = index + 2;
            var idx = index;
            obj.style.zIndex = idx;
            obj.nextSibling.style.zIndex = idx - 1;
        }
    }
    //最小化; 
    function min(obj) {
        var win = obj.parentNode.parentNode;
        var sha = win.nextSibling;
        var tit = obj.parentNode;
        var msg = tit.nextSibling;
        var flg = msg.style.display == "none";
        //窗口移动到左上角
        //win.style.left = 0; 
        //win.style.top = 0; 
        //sha.style.left = parseInt(win.style.left) + offx; 
        //sha.style.top = parseInt(win.style.top) + offy;         var H = parseInt(tit.style.height); //最小化窗口的高度
        var bodyH = document.body.offsetHeight; //可见页面的高度
        //定位左下角
        alert(bodyH-H);
        win.style.top = (bodyH - H) + "px";
        win.style.left = "0px";
        sha.style.left = parseInt(win.style.left) + offx;
        sha.style.top = parseInt(win.style.top) + offy;        if (flg) {
            win.style.height = parseInt(msg.style.height) + parseInt(tit.style.height) + 2 * 2;
            sha.style.height = win.style.height;
            msg.style.display = "block";
            obj.innerHTML = "0";
        }
        else {
            win.style.height = parseInt(tit.style.height) + 2 * 2;
            sha.style.height = win.style.height;
            obj.innerHTML = "2";
            msg.style.display = "none";
        }
    }    //创建一个对象; 
    function xWin(id, w, h, l, t, tit, msg) {
        index = index + 2;
        this.id = id;
        this.width = w;
        this.height = h;
        this.left = l;
        this.top = t;
        this.zIndex = index;
        this.title = tit;
        this.message = msg;
        this.obj = null;
        this.bulid = bulid;
        this.bulid();
    }
    //初始化; 
    function bulid() {
        var str = ""
+ "<div id=xMsg" + this.id + " "
+ "style='"
+ "z-index:" + this.zIndex + ";"
+ "width:" + this.width + ";"
+ "height:" + this.height + ";"
+ "left:" + this.left + ";"
+ "top:" + this.top + ";"
+ "background-color:" + normal + ";"
+ "color:" + normal + ";"
+ "font-size:8pt;"
+ "font-family:Tahoma;"
+ "position:absolute;"
+ "cursor:default;"
+ "border:2px solid " + normal + ";"
+ "' "
+ "onmousedown='getFocus(this)'>"
+ "<div "
+ "style='"
+ "background-color:" + normal + ";"
+ "width:" + (this.width - 2 * 2) + ";"
+ "height:20;"
+ "color:white;"
+ "' "
+ "onmousedown='startDrag(this)' "
+ "onmouseup='stopDrag(this)' "
+ "onmousemove='drag(this)' "
+ "ondblclick='min(this.childNodes[1])'"
+ ">"
+ "<span style='width:" + (this.width - 2 * 12 - 4) + ";padding-left:3px;'>" + this.title + "</span>"
+ "<span style='width:12;border-width:0px;color:white;font-family:webdings;' onclick='min(this)'>0</span>"
+ "<span style='width:12;border-width:0px;color:white;font-family:webdings;' onclick='ShowHide(\"" + this.id + "\",null)'>r</span>"
+ "</div>"
+ "<div style='"
+ "width:100%;"
+ "height:" + (this.height - 20 - 4) + ";"
+ "background-color:white;"
+ "line-height:14px;"
+ "word-break:break-all;"
+ "padding:3px;"
+ "'>" + this.message + "</div>"
+ "</div>"
+ "<div id=xMsg" + this.id + "bg style='"
+ "width:" + this.width + ";"
+ "height:" + this.height + ";"
+ "top:" + this.top + ";"
+ "left:" + this.left + ";"
+ "z-index:" + (this.zIndex - 1) + ";"
+ "position:absolute;"
+ "background-color:black;"
+ "filter:alpha(opacity=40);"
+ "'></div>";
        document.body.insertAdjacentHTML("beforeEnd", str);
    }
    //显示隐藏窗口 
    function ShowHide(id, dis) {
        var bdisplay = (dis == null) ? ((document.getElementById("xMsg" + id).style.display == "") ? "none" : "") : dis
        document.getElementById("xMsg" + id).style.display = bdisplay;
        document.getElementById("xMsg" + id + "bg").style.display = bdisplay;
    } 
//--> 
</script> <script language='JScript'> 
<!--
    function initialize() {
        var a = new xWin("1", 160, 200, 200, 200, "窗口1", "xWin <br/> A Cool Pop Div Window<br/>Version:1.0<br/>2002-8-13");
        var b = new xWin("2", 240, 200, 100, 100, "窗口2", "Welcome to visited my personal website:<br/><a href=http://www.youthfly.net target=_blank>http://www.youthfly.net</a><br/>anducanalsosignmyguestbookat:<br/><ahref=http://www ... youthfly.net</a><br/><br/>thx!!!=)...");
        var c = new xWin("3", 750, 700, 140, 10, "<center>个人简介</center>", "Copyright by 网页一班!");
        ShowHide("1", "none");
        ShowHide("2", "none");
        ShowHide("3", "none"); //隐藏窗口1 
        center('1'); center('2'); center('3');
    }
    window.onload = initialize;
    //--> 
    function center(id) {
        xwin = document.getElementById("xMsg" + id);
        var wleft = (document.body.clientWidth - xwin.style.width.replace("px", "")) / 2 < 0 ? 0 : (document.body.clientWidth - xwin.style.width.replace("px", "")) / 2;
        var wtop = (document.body.clientHeight - xwin.style.height.replace("px", "")) / 2 < 0 ? 0 : (document.body.clientHeight - xwin.style.height.replace("px", "")) / 2; ;        xwin.style.left = wleft;
        xwin.style.top = wtop;        xwinbg = document.getElementById("xMsg" + id + "bg");
        xwinbg.style.left = wleft;
        xwinbg.style.top = wtop;
    } 
</script> 
</head> 
<!--<base target="_blank">--> 
<body onselectstart="return false" oncontextmenu="return false"> 
<a href="javascript:ShowHide('1',null)" >窗口1</a> 
<a  href="javascript:ShowHide('2',null)">窗口2</a> 
<a  href="javascript:ShowHide('3',null)">窗口3</a> 
</body> 
</html> 

解决方案 »

  1.   


    sha.style.left = x1 + offx + "px";
    sha.style.top = y1 + offy + "px";
    在有style.left、style.top的地方加上px看看
      

  2.   

    检查一下你代码里面，长度没有加单位的，统统加上单位。
    比如，left，height等的值
    见：http://topic.csdn.net/u/20100714/20/759e2fc2-a619-42b8-a8e9-6fcab711f7cb.html?50055
      

  3.   

    加上单位后最大化和最小化 解决了 呵呵…… 谢谢上面的各位咯！但是后面还有问题1、在最小化后再最大化的时候 如何使层还原到原来的位置。
    2、这个弹出层中的内容：
    也就是在 var a = new xWin("1", 160, 200, 200, 200, "窗口1", "xWin <br/> A Cool Pop Div Window<br/>Version:1.0<br/>2002-8-13");
     的时候如何使其中的能容具有扩展性，比如传个iframe 可以将iframe url 引用到或者
    随便传什么都能加载进去，只要是页面能容呢？
    3、如何使这代码和火狐等那些不是IE系列的浏览器兼容。