//弹出层
function openLayer()
{
//创建一个div元素
var popupDiv = document.createElement("div");

//给这个元素设置属性与样式
popupDiv.setAttribute("id","popupAddr")
popupDiv.style.border = "1px solid #ccc";
popupDiv.style.width = "600px";
popupDiv.style.height = "400px";
popupDiv.style.background = "#fff";
popupDiv.style.zIndex = 99;
popupDiv.style.position = "absolute";


//让弹出层在页面中垂直左右居中
var arrayPageSize = getPageSize();
var arrayPageScroll = getPageScroll();
//alert(arrayPageScroll);
//alert(arrayPageSize);

popupDiv.style.top = (arrayPageScroll[1] + ((arrayPageSize[3] - 35 - 400) / 2) + 'px') ;
popupDiv.style.left = (((arrayPageSize[0] - 20 - 600) / 2) + 'px');

//创建背景层
var bodyBack = document.createElement("div");
bodyBack.setAttribute("id","bodybg")
bodyBack.style.width = "100%";
bodyBack.style.height = (arrayPageSize[1] + 35 + 'px');
bodyBack.style.zIndex = 98;
bodyBack.style.position = "absolute";
bodyBack.style.top = 0;
bodyBack.style.left = 0;

bodyBack.style.filter = "alpha(opacity=20)";
bodyBack.style.opacity = 0.2;
bodyBack.style.background = "#000";

//收工插入到目标元素之后
var mybody = document.getElementById("test");
insertAfter(popupDiv,mybody);
insertAfter(bodyBack,mybody);

//弹出层内容
popupDiv.innerHTML = addrHTML();


}
//元素插入另一个元素之后
function insertAfter(newElement, targetElement)
{
    var parent = targetElement.parentNode;
    if(parent.lastChild == targetElement)
    {
        parent.appendChild(newElement);
    }
    else
    {
        parent.insertBefore(newElement, targetElement.nextSibling);
    }
}
//获取滚动条的高度
function getPageScroll(){
var yScroll;
if (self.pageYOffset) {
   yScroll = self.pageYOffset;
} else if (document.documentElement && document.documentElement.scrollTop){ // Explorer 6 Strict
   yScroll = document.documentElement.scrollTop;
} else if (document.body) {// all other Explorers
   yScroll = document.body.scrollTop;
}
arrayPageScroll = new Array('',yScroll)
return arrayPageScroll;
}
//获取页面实际大小
function getPageSize(){
   
    var xScroll, yScroll;
   
    if (window.innerHeight && window.scrollMaxY) {   
        xScroll = document.body.scrollWidth;
        yScroll = window.innerHeight + window.scrollMaxY;
    } else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
        xScroll = document.body.scrollWidth;
        yScroll = document.body.scrollHeight;
    } else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
        xScroll = document.body.offsetWidth;
        yScroll = document.body.offsetHeight;
    }
   
    var windowWidth, windowHeight;
    if (self.innerHeight) {    // all except Explorer
        windowWidth = self.innerWidth;
        windowHeight = self.innerHeight;
    } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
        windowWidth = document.documentElement.clientWidth;
        windowHeight = document.documentElement.clientHeight;
    } else if (document.body) { // other Explorers
        windowWidth = document.body.clientWidth;
        windowHeight = document.body.clientHeight;
    }   
   
    // for small pages with total height less then height of the viewport
    if(yScroll < windowHeight){
        pageHeight = windowHeight;
    } else {
        pageHeight = yScroll;
    }

    // for small pages with total width less then width of the viewport
    if(xScroll < windowWidth){   
        pageWidth = windowWidth;
    } else {
        pageWidth = xScroll;
    }

    arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight)
    return arrayPageSize;
}
//关闭弹出层
function closeLayer(obj)
{
obj.style.display = "none";
document.getElementById("bodybg").style.display = "none";
return false;
}
//拖动函数
function mousedown(e)
{
var obj = document.getElementById("popupAddr");
var e = window.event ? window.event : e;

obj.startX = e.clientX - obj.offsetLeft;
obj.startY = e.clientY - obj.offsetTop;


document.onmousemove = mousemove;
var temp = document.attachEvent ? document.attachEvent("onmouseup",mouseup) : document.addEventListener("mouseup",mouseup,"");
}
function mousemove(e)
{
var obj = document.getElementById("popupAddr");
var e = window.event ? window.event : e;

with(obj.style)
{
   left = (e.clientX - obj.startX)<10 ? 10 : (e.clientX - obj.startX) + "px";
   top = (e.clientY - obj.startY)<10?10:(e.clientY - obj.startY) + "px";
}
}
function mouseup(e)
{
var e = window.event ? window.event : e;
var obj = document.getElementById("popupAddr");
var currentX=e.clientX - obj.startX;
var currentY=e.clientY - obj.startY;
//让弹出层在页面中垂直左右居中
var arrayPageSize = getPageSize();
var arrayPageScroll = getPageScroll();
//alert(arrayPageScroll);
//alert(arrayPageSize);

//popupDiv.style.top = (arrayPageScroll[1] + ((arrayPageSize[3] - 35 - 400) / 2) + 'px') ;
//popupDiv.style.left = (((arrayPageSize[0] - 20 - 600) / 2) + 'px');
//alert(arrayPageSize[1]);
var maxX=arrayPageSize[0]-600-24;
var maxY=arrayPageScroll[1] +((arrayPageSize[3] - 400));

if(currentX>maxX)
{
   obj.style.left=maxX-10 + "px";
}
if(currentY>maxY)
{
   obj.style.top=maxY-10 + "px";
}
document.onmousemove = "";
var temp = document.detachEvent ? document.detachEvent("onmouseup",mouseup) : document.addEventListener("mouseup",mouseup,"");
}
//END拖动函数
//弹出层内容
function addrHTML() {
//文字
var sm ='<table width="100%" border="1"><tr><td>家居資訊產品說明</td><td><div align="center">一般型</div></td><td><div align="center"><strong style="color:red;">豪華型</strong></div></td></tr><tr><td>資料編輯</td><td><div align="center"><img width="20" height="20" src="images/clip_image001.gif" /></div></td><td><div align="center"><img width="20" height="20" src="images/clip_image001.gif" /></div></td></tr><tr><td>隨時更新</td><td><div align="center"><img width="20" height="20" src="images/clip_image002.gif" /><br/><span style="color:red;">(需滿七天)</span></div></td><td><div align="center"><img width="20" height="20" src="images/clip_image001.gif" /></div></td></tr><tr><td>照片上傳</td><td><div align="center"><img width="20" height="20" src="images/clip_image002.gif" /></div></td><td><div align="center"><img width="20" height="20" src="images/clip_image001.gif" /><br/><strong style="color:red;">(有六張)</strong></div></td></tr><tr><td>證照上傳</td><td><div align="center"><img width="20" height="20" src="images/clip_image002.gif" /></div></td><td><div align="center"><img width="20" height="20" src="images/clip_image001.gif" /></div></td></tr><tr><td>問與答</td><td><div align="center"><img width="20" height="20" src="images/clip_image002.gif" /></div></td><td><div align="center"><img width="20" height="20" src="images/clip_image001.gif" /></div></td></tr><tr><td>得獎及媒體報導</td><td><div align="center"><img width="20" height="20" src="images/clip_image002.gif" /></div></td><td><div align="center"><img width="20" height="20" src="images/clip_image001.gif" /></div></td></tr><tr><td><strong style="color:red;">家居網首頁黃金版<br/>(每日有8000次點閱)</strong></td><td><div align="center"><img width="20" height="20" src="images/clip_image002.gif" /></div></td><td><div align="center"><img width="20" height="20" src="images/clip_image001.gif" /></div></td></tr><tr><td><strong style="color:red;"> 租屋網首頁曝光<br/>(每日有50000次點閱)</strong></td><td><div align="center"><img width="20" height="20" src="images/clip_image002.gif" /></div></td><td><div align="center"><img width="20" height="20" src="images/clip_image001.gif" /></div></td></tr><tr><td>費用</td><td><div align="center">1000/年</div></td><td><div align="center"> <strong style="color:red;">2000月半年以上有折扣</strong></div></td></tr></table>';
var CLOSE = '<img src="images/closel.gif" style="cursor:pointer;" onclick="javascript:closeLayer(this.parentNode.parentNode.parentNode.parentNode); write_result();" alt="閉關" width=15 height=15 />';

//图片地址
var TITLEBG = "";
var ICN = "";
var htmlDiv = '';
htmlDiv += '<div style="width:100%;font-size:12px;">';

//头部
htmlDiv += '<div style="height:23px;color:#fff;cursor:move;" onmousedown="mousedown(arguments[0])">';

htmlDiv += '<span style="float:left;color:#999999;padding-left:4px;padding-right:4px;"><strong>家居資訊產品說明</strong></span><span style="float:right;padding-right:6px;line-height:30px;padding-top:4px;">';
htmlDiv += CLOSE;
htmlDiv += '</span>';
htmlDiv += '</div>';
//END头部

//内容部分
htmlDiv += '<div id="container" style="width:592px;height:400px;padding-left:4px;padding-right:4px;">'+sm+'</div>';

//END内容部分
htmlDiv += '</div>';
return htmlDiv;
}