브라우저 사이즈에 맞게 이미지를 자동으로 조절하는 소스 입니다.
간단하게 작성한 내용입니다.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | <meta http-equiv="Content-Type" content="text/html; utf-8"> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=2.0, minimum-scale=1.0, user-scalable=yes, target-densitydpi=medium-dpi" > <title>노넨 레나</title> <style type="text/css"> .viewer { width:100%;} .viewer img { max-width:100%; } </style> </head> <body> <div class="viewer"> <img src="./no.jpg" /> </div> </body> </html> |
아래 첨부 파일을 참고하세요. ^^
테스트는 http://troy.labs.daum.net/ 여기서 가능 합니다.
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=2.0, minimum-scale=1.0, user-scalable=yes, target-densitydpi=medium-dpi" >
상단의 meta 태그는 디바이스별 가로 길이를 맞춰줍니다.
자바 스크립트 setInterval, clearInterval (타이머) (0) | 2014.05.22 |
---|---|
jQuery 버튼값 가져오기 (0) | 2014.04.17 |
jQuery 탭(tab) 메뉴 모음 (0) | 2014.04.08 |
JavaScript 에서 JSON Parse (0) | 2014.03.26 |
Drag&Drop 연결선 (jsPlumb) (0) | 2014.03.11 |
댓글 영역