http://oxtag.com/html/ex/layer_popup/img_autosize_win.html
겔러리 게시판에서 이미지를 클릭하면 지가 알아서 이미지 사이즈에 맞게 새창이 띄워지죠.
요건 다른겁니다. 미리보기는 위 링크를 클릭하세요. 추천 할만한 소스라는....
<html>
<head>
<script language="javascript">
function view(what) {
var imgwin = window.open("",'WIN','scrollbars=no,status=no,toolbar=no,resizable=1,location=no,menu=no,width=10,height=10');
imgwin.focus();
imgwin.document.open();
imgwin.document.write("<html>");
imgwin.document.write("<head>");
imgwin.document.write("<title>**</title>");
imgwin.document.write("<sc"+"ript>\n");
imgwin.document.write("function resize() {\n");
imgwin.document.write("pic = document.il;\n");
//imgwin.document.write("alert(eval(pic).height);\n");
imgwin.document.write("if (eval(pic).height) { var name = navigator.appName\n");
imgwin.document.write(" if (name == 'Microsoft Internet Explorer') { myHeight = eval(pic).height + 40; myWidth = eval(pic).width + 12;\n");
imgwin.document.write(" } else { myHeight = eval(pic).height + 9; myWidth = eval(pic).width; }\n");
imgwin.document.write(" clearTimeout();\n");
imgwin.document.write(" var height = screen.height;\n");
imgwin.document.write(" var width = screen.width;\n");
imgwin.document.write(" var leftpos = width / 2 - myWidth / 2;\n");
imgwin.document.write(" var toppos = height / 2 - myHeight / 2; \n");
imgwin.document.write(" self.moveTo(leftpos, toppos);\n");
imgwin.document.write(" self.resizeTo(myWidth, myHeight);\n");
imgwin.document.write("}else setTimeOut(resize(), 100);}\n");
imgwin.document.write("</sc"+"ript>");
imgwin.document.write("</head>");
imgwin.document.write('<body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0" bgcolor="#FFFFFF">');
imgwin.document.write("<a href=# onclick=window.close() onfocus=this.blur()><img border=0 src="+what+" xwidth=100 xheight=9 name=il onload='resize();'></a>");
imgwin.document.write("</body>");
imgwin.document.close();
}
</script>
</head>
<body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0" bgcolor="#FFFFFF">
<center> <br><br><font style=font-size:9pt;color:ff9900>아래 이미지를 각각 클릭해보세요.</font><br><br>
<a href="javascript:view('../../zboard/data/gallery/ani_42.jpg')" onfocus=this.blur()><img src=../../zboard/data/gallery/ani_42.jpg border=0 width=50 height=100></a>
<a href="javascript:view('../../zboard/data/gallery/kiss.jpg')" onfocus=this.blur()><img src=../../zboard/data/gallery/kiss.jpg border=0 width=50 height=100></a>
<a href="javascript:view('../../zboard/data/kiss_21.jpg')" onfocus=this.blur()><img src=../../zboard/data/kiss_21.jpg border=0 width=50 height=100></a>
<a href="javascript:view('../../zboard/data/puppy_3.jpg')" onfocus=this.blur()><img src=../../zboard/data/puppy_3.jpg border=0 width=50 height=100></a>
</center>
</body>
</html>
반응형
'인터넷정보' 카테고리의 다른 글
| 새창을 페이지 로딩시 원하는 시간에 띄우고 닫게하자. (0) | 2007.10.17 |
|---|---|
| 갤러리 꾸미기 2 (아래 두개 합친거.. 배너광고없는 갤러리방을 만들어보세요.) (0) | 2007.10.17 |
| 갤러리 꾸미기 2 (아래 두개 합친거.. 배너광고없는 갤러리방을 만들어보세요.) (0) | 2007.10.17 |
| 이미지에 마우스 오버시 레이어창(풍선도움말) (0) | 2007.10.17 |
| 이미지에 마우스 오버시 레이어창(풍선도움말) (0) | 2007.10.17 |
| 갤러리 꾸미기 1 (이미지 원래의 크기로 새창이 열립니다) (0) | 2007.10.17 |
| 재생중인 곡목표시 및 랜덤 음악듣기 (0) | 2007.10.17 |
| 재생중인 곡목표시 및 랜덤 음악듣기 (0) | 2007.10.17 |
| HTML소스를 특수문자로 바꿔줍니다. (0) | 2007.10.17 |
| HTML소스를 특수문자로 바꿔줍니다. (0) | 2007.10.17 |