JavaScript로 작성된 DIV는 웹 페이지 대화 상자를 표시합니다._javascript 기술

온라인에서 코드를 검색하여 일부 수정했습니다.
색상을 맞춤 설정할 수 없는 문제 수정, IE8에서 오류 수정, 기타 작은 버그 수정 IE6~8 및 Firefox와 호환
맞춤 설정 가능
//프롬프트 창 title Height
// 프롬프트 창 테두리 색상
// 프롬프트 창 제목 색상
// 프롬프트 창 제목 배경색
// 프롬프트 내용 배경색
// 프롬프트 내용 텍스트 정렬
기능은 페이지를 덮을 만큼 큰 DIV를 띄운 다음(IE에서는 투명) 화면 중앙에 작은 DIV를 표시할 수 있습니다.
기능 프롬프트, 작동 팁 및 공지 사항 등으로 사용할 수 있습니다.
프롬프트 내용은 HTML로 작성 가능 표시된 텍스트는 페이지 링크도 가능

코드 복사 코드는 다음과 같습니다 :

function MessageBox( )
{
this.titleheight = "21"; // 프롬프트 창 제목 높이
this.bordercolor = "#666699" // 프롬프트 창 테두리 색상
this.titlecolor = "# 1259a4"; // 프롬프트 창 제목 색상
this.titlebgcolor = "#e4f1fb" // 프롬프트 창 제목 배경 색상
this.bgcolor = "#FFFFFF"; // 프롬프트 내용의 배경색
this.MsgAlign="left";

this.Show=function(title, msg,framerc, w, h)
{
var iWidth = document.documentElement.clientWidth;
var iHeight = document.documentElement.clientHeight document.documentElement.scrollTop*2;
var bgObj = document.createElement("div"); bgObj.style.cssText = "위치:absolute;왼쪽:0px; 위쪽:0px;너비:" iWidth "px;height:" Math.max(document.body.clientHeight, iHeight) "px;filter:Alpha(Opacity= 30);불투명도:0.3;배경색:#000000;z -index:101;";
document.body.appendChild(bgObj);

var msgObj=document.createElement("div" );
msgObj.style.cssText = "위치:absolute ;font:11px '宋体';top:" (iHeight-h)/2 "px;left:" (iWidth-w)/2 "px;width :" w "px;height:" h "px;text- align:center;border:1px solid " this.bordercolor "; background-color:" this.bgcolor ";padding:1px;line-height:22px;z -index:102;";
document.body.appendChild(msgObj);

var table = document.createElement("table");
msgObj.appendChild(table);
table.style.cssText = "margin:0px;border:0px; padding:0px;";
table.cellSpacing = 0;
var tr = table.insertRow(-1); tr.insertCell(-1);
titleBar.style.cssText = ";width:" (w-84) "px;height:" this.titleheight "px;text-align:left;padding:3px;margin :0px;font:bold 13px '宋体';color:" this .titlecolor ";cursor:move;ground-color:" this.titlebgcolor;
titleBar.style.paddingLeft = "10px";
titleBar. innerHTML = title;
var moveY = 0;
var moveTop = 0
var docMouseMoveEvent = document.onmousemove;
var docMouseUpEvent = document.onmouseup;

titleBar.onmousedown = function(){
var evt = getEvent();
moveX = evt.clientX;
moveY = evt.clientY;
moveTop = parsInt(msgObj.style.top);
moveLeft = parsInt(msgObj.style.left)

document.onmousemove = function(){
if (이동 가능)
{
var evt = getEvent();
var x = moveLeft evt.clientX - moveX
var y = moveTop evt.clientY - moveY;
if ( x > 0 &&( x w < ; iWidth) && y > 0 && (y h {
msgObj.style.left = x "px"; 🎜>msgObj.style.top = y "px";
}
}
}

document.onmouseup = function (){
if (이동 가능)
{
document.onmouseMoveEvent;
document.onmouseup = docMouseUpEvent;
moveX = 0
moveTop = 0; moveLeft = 0;
}
};

var closeBtn = tr.insertCell(-1)
closeBtn.style.cssText = "cursor:pointer; 패딩: 2px;배경색:" this.titlebgcolor;
closeBtn .innerHTML = " ×창 닫기";
closeBtn.onclick = function(){
document.body.removeChild(bgObj)
document.body. RemoveChild(msgObj);
}
var msgBox = table.insertRow(-1).insertCell(-1);
msgBox.style.cssText = "font:10pt '宋体';"; >msgBox.colSpan = 2;

if(framesrc != "")
{
msg = "";
}
msgBox.innerHTML = "

" msg "

";
if(document.getElementById("frmAlertWin") != null)
{
document.getElementById("frmAlertWin").src =framerc; function getEvent(){
return window.event || 인수 .callee.caller.arguments[0]
}
}
}


호출 방법
var msgbox=new MessageBox();
msgbox.Show('사이트 공지',"Tips","",500,220);///매개변수: 제목, 내용(Tip 페이지 접속 시 비워두세요), 링크 페이지 주소(텍스트 사용 시 비워둘 수 있음), 너비, 높이
주의할 점은 페이지 로딩 시 프롬프트가 뜨면 호출 코드를 넣어주세요 body 태그 뒤에, 그렇지 않으면 IE8에서 오류가 발생합니다