반응형
Javascript
function popupImage(url){
var img = new Image();
var scWidth = screen.availWidth; //현재 사용중인 스크린 크기를 구함
var scHeight = screen.availHeight;
var left = (parseInt(scWidth)-650)/2; //팝업창 위치 조절
var top = (parseInt(scHeight)-900)/2;
img.src = url;
var img_width = img.width-500; //팝업창 크기 조절
var win_width = img.width-500;
var height = img.height-290;
var openImage = window.open('','_blank','width='+img_width+',height='+heigh',top='+top+',left='+left+',menubars=no,scrollbars=auto');
openImage.document.write("<style>body{margin:0px;}</style><a href = # onclick = window.close() onfocus=this.blur()><img src = '"+url+"'width='"+win_width+"'></a>");
}
HTML
<img src = "경로" onclick = "javascript:popupImage(this.src);"/>
반응형
'Web Development > Frontend' 카테고리의 다른 글
| [JQuery]checkbox 체크여부 true,false로 출력 (0) | 2017.10.17 |
|---|---|
| [WebSquare]script submission (0) | 2017.10.17 |
| [JQuery] attr(HTML 태그 속성 변경) (0) | 2017.09.18 |
| [JQuery] CSS 조작 (0) | 2017.08.28 |
| [HTML] 이미지맵 사용법 (2) | 2017.06.16 |