개발을 하다 보니 팝업으로 이미지를 띄울 경우가 있죵..
근데 페이지 만들기 귀찮고, 파라미터 뭘 넘겨야 할지 고민되서
그냥 제가 페이지 안만들고 이미지 팝업 띄울수 있는 소스 만들어 봤습니다.
하지만 아직까지 베타는 커녕 걍 테스트 버전이니 저에게 뭐라고 하지 마세요~
단점은 몇개 있습니다.
1. 새로고침 할 경우 blank페이지로 간다. => 요건 페이지에 스크립트 추가해 넣으면 될거 같은데.. 새로고침 막는 스크립트 있잖아요~ 암튼 고거.
2. IE 7.0 (6.0은 아마도) 에서만 된다. => 뭐 호환성 테스트는 제가 무쟈게 귀차나 해서리~ ㅋㅋ
아래는 소스입니다.
var OpenWindow;
function BigImage()
{
OpenWindow = window.open("","_BigImage","width=10,height=10,top=0,left=0");
var ImgObj = "<img id='BigImage' src='" + event.srcElement.src + "' onclick='self.close();'>"
OpenWindow.document.title = "큰이미지 보기";
OpenWindow.document.body.style.cursor = "hand";
OpenWindow.document.body.innerHTML = ImgObj;
setTimeout("SetPopup()",100);
}
function SetPopup()
{
var BigImageObjWidth = OpenWindow.document.getElementById("BigImage").width;
var BigImageObjHeight = OpenWindow.document.getElementById("BigImage").height;
var PCMaxHeight = screen.availHeight - 100;
var PCMaxWidth = screen.availWidth - 100;
if (BigImageObjWidth > PCMaxWidth){
BigImageObjWidth = PCMaxWidth;
OpenWindow.document.getElementById("BigImage").width = PCMaxWidth - 30;
}
else{
BigImageObjWidth = eval( BigImageObjWidth + "+" + 30);
}
if (BigImageObjHeight > PCMaxHeight){
BigImageObjHeight = PCMaxHeight;
OpenWindow.document.getElementById("BigImage").height = PCMaxHeight - 90;
}
else{
BigImageObjHeight = eval( BigImageObjHeight + "+" + 90);
}
OpenWindow.resizeTo(BigImageObjWidth, BigImageObjHeight);
OpenWindow.focus();
OpenWindow.resizeTo(BigImageObjWidth, BigImageObjHeight);
}
이 아래는 예제 입니다 ~ 근데 이미지가 넘 작아서리~ ㅋㅋ