common.js
var imgCommonPreview = new Image();
function showPicture(imgSrc) {
imgCommonPreview.src = imgSrc;
setTimeout("createPreviewWin(imgCommonPreview)", 100);
}
function createPreviewWin(imgCommonPreview) {
if (! imgCommonPreview.complete) {
setTimeout("createPreviewWin(imgCommonPreview)", 100);
return;
}
var scrollsize = 17;
var swidth = screen.width - 10;
var sheight = screen.height - 90;
var wsize = imgCommonPreview.width
var hsize = imgCommonPreview.height;
if(wsize < 500) wsize = 500; // 가로 최소 크기
if(hsize < 500) hsize = 500; // 세로 최소 크기
if(wsize > swidth) wsize = swidth; // 가로 최대 크기
if(hsize > sheight) hsize = sheight; // 세로 최대 크기
//세로가 최대크기를 초과한경우 세로스크롤바 자리 확보
if((wsize < swidth-scrollsize) && hsize >= sheight) wsize += scrollsize;
//가로가 최대크기를 초과한경우 가로스크롤바 자리 확보
if((hsize < sheight-scrollsize) && wsize >= swidth) hsize += scrollsize;
// IE 6,7 전용 : 가로세로 크기가 보통일때 세로 스크롤바 자리 확보
if((wsize < swidth-scrollsize) && hsize < sheight
&& (navigator.userAgent.indexOf("MSIE 6.0") > -1
|| navigator.userAgent.indexOf("MSIE 7.0") > -1))wsize += scrollsize;
imageWin = window.open("", "winPreviewImg", "top=0,left=0,width=" + wsize
+ ",height=" + hsize +",scrollbars=yes,resizable=yes,status=no");
imageWin.document.write("<html><title>Preview</title><body style='margin:0;cursor:pointer;' title='Close' onclick='window.close()'>");
imageWin.document.write("<img src='" + imgCommonPreview.src + "'>");
imageWin.document.write("</body><html>");
}
index.html
<html>
<head>
<script type="text/javascript" src="common.js"></script>
</head>
<body>
<a href="javascript:showPicture('이미지경로')">열기</a><br>
</body>
</html>
'CSS_JS' 카테고리의 다른 글
| html 부드러운 스크롤 쉬운적용 jquery smooth scroll (0) | 2017.11.16 |
|---|---|
| ie8 버전 이하 html5.js 적용하기 (0) | 2017.11.10 |
| 반응형 웹에서 이미지맵 사용하기 (0) | 2017.05.15 |
| 브라우저 스크롤 반응 스크롤바 (0) | 2017.05.15 |
| 이미지 링크점선 없애기 (0) | 2017.05.15 |