반응형웹 관련

· 2013-11-18 (월) 10:23:43 · 2501 · 2
<meta name="viewport" content="width=640px,user-scalable=yes" />
<meta name="viewport" content="width=device-height" media="only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape)"/>

<script type="text/javascript">
var viewPortWidth = $(window).width();
if (viewPortWidth > 767){//아이패드 사이즈일때
document.getElementsByTagName("meta")[3].content="width=device-width,initial-scale=1,minimum-scale=1; maximum-scale=1";
}else if (viewPortWidth < 768){//모바일 사이즈일때
document.getElementsByTagName("meta")[3].content="width=640px, target-densitydpi=device-dpi ";//user-scalable=no
}

var ua = window.navigator.userAgent.toLowerCase();
if ( /shv-e160/.test( ua ) || /shv-e210/.test( ua ) ){ //갤럭시노트 or 갤3
document.getElementsByTagName("meta")[3].content="width=640px, target-densitydpi=device-dpi,user-scalable=no";
}


반응형웹인 한 병원 홈페이지에 들어가보니깐
viewport 관련해서 저렇게 되어있더라구요

근데 제가 똑같이 코드 따사 하니깐 자꾸 모바일로보면 확대?줌??이되잇어요...ㅠㅠ
딱 맞게 안되있고

css도 맞게 줬는뎅.....테스트도 완료해봣는뎅
viewport만 문제네요~

희안하네....
저 스크립트나 viewport태그가 잘못된건가용?

common.php관련해서 그런건 관련없겠죠?ㅎㅎ
include 시켜놧는데.. ㅎㅎ 호옥~시나해서 ㅎㅎ
|

댓글 2개

2013-11-18 (월) 10:57:39
보통 반응형 웹은 responsive.css 를 만들어서 사용합니다.
위의 처럼 사이즈만 확인해서는 안되고

각각의 사이즈일때 css를 바꾸서 사용합니다.
이미지 크기나 폰트 크기 / 좌우측메뉴를 위로 올리거나 등등
구글에서 css responsive하고
css viewport 검색하셔서 참고하세요~
각 사이즈별 css는 해놧어요 ㅎㅎ 그냥 저런거 없이 가기로 햇습니다 ㅎ 암튼 답변 감사감사
댓글을 작성하시려면 로그인이 필요합니다.

그누4 질문답변

66,531건

그누보드4 관련 질문은 QA 로 이전됩니다. QA 그누보드4 바로가기 기존 게시물은 열람만 가능합니다.

+
제목 글쓴이 날짜 조회
13-11-18 조회 2,502
13-11-18 조회 1,820
13-11-18 조회 1,925
13-11-17 조회 1,329
13-11-17 조회 1,758
13-11-17 조회 7,692
13-11-17 조회 2,085
13-11-17 조회 1,613
13-11-17 조회 1,803
13-11-17 조회 2,308
13-11-17 조회 1,725
13-11-17 조회 2,085
13-11-17 조회 1,800
13-11-17 조회 1,366
13-11-17 조회 1,224
13-11-17 조회 2,936
13-11-17 조회 1,294
13-11-17 조회 1,312
13-11-17 조회 2,188
13-11-17 조회 1,360