function behindBox(id, idref) { var outer = document.createElement('div'), bh = Math.max(bodyHeight(), document.body.offsetHeight)+getScroll().y, bw = document.body.clientWidth; outer.id = id; outer.style.cssText = 'position:absolute; top:0; left:0; width:'+bw+'px; height:'+bh+ 'px; background-color:#000000; opacity:.7; -moz-opacity:.7; filter:alpha(opacity=70); z-index:100;'; document.body.appendChild(outer); if(idref) document.body.appendChild($(idref)); return outer; } function remove(id) { $(id).parentNode.removeChild($(id)); } // altura do elemento function bodyHeight() { if(self.innerHeight) return self.innerHeight; else if(document.documentElement && document.documentElement.clientHeight) return document.documentElement.clientHeight; else return document.body.clientHeight || 0; } // mede a rolagem da página function getScroll() { return { 'y': document.all ? document.documentElement.scrollTop : window.pageYOffset, 'x': document.all ? document.documentElement.scrollLeft : window.pageXOffset }; } // centraliza um elemento function center(elem) { var ew = elem.clientWidth, eh = elem.clientHeight, top = ((bodyHeight() / 2) - (eh / 2)) + getScroll().y, left = ((document.body.offsetWidth / 2) - (ew / 2)) + getScroll().x; elem.style.top = top+'px'; elem.style.left = left+'px'; } function openBox(id, w, h) { var e = $(id), b = document.createElement('div'); _box_parent = e.parentNode; b.id = id+'_box'; b.style.width = w; b.style.height = h; b.style.position = 'absolute'; b.style.zIndex = 101; b.appendChild(e); var bg = behindBox('behind'); document.body.appendChild(b); center(b); } function closeBox(id) { _box_parent.appendChild($(id)); remove(id+'_box'); remove('behind'); }