2015-01-19 9 views
1

Nexus 5가 있는데 http://ryanve.com/lab/dimensions/으로 갈 때 내 너비가 360이라고 알려줍니다. 휴대 전화의 해상도와 브라우저의 너비가 다른 점을 이해합니다. 그러나모바일 용 브라우저 너비

, 내가 아래 767로 변경하는 함수를 작성할 때 :

function detectmob() { 
    if($(window).width() <= 767) { 
     return true; 
    } 

    else { 
     return false; 
    } 
} 

if (detectmob()){ 

} 

else { 

} 

그것은 내 휴대 전화에서 작동하지 않습니다. 랩톱에서 브라우저 창 너비를 < = 767로 조정하면 기능이 올바르게 작동합니다. 내 Nexus 5에서 볼 때, 그렇지 않습니다.

누구든지 브라우저 너비를 사용하여 모바일 장치를 타겟팅하는 기능을 쓸 수 있습니까?

답변

1

모바일 브라우저를 통해 웹 사이트를 방문하면 큰 바탕 화면 경험을하고 있고 왼쪽 상단뿐만 아니라 모든 것을보고 싶다고 가정합니다. 따라서 (iOS Safari의 경우) 980px의 뷰포트 너비를 설정하여 모든 것을 신발 디스플레이에 표시합니다.

애플에 의해 도입 된 뷰포트 메타 태그를 입력 뷰포트 메타 태그, 다음, 채택 및 다른 사람에 의해 더욱 발전. 당신이 쉼표로 구분 된 값의 부하를 입력 할 수 있습니다 ""= 컨텐츠 내에서

<meta name="viewport" content=""> 

, 그러나 우리는 지금 기본적인 것들에 초점을 겁니다 :

그것은 다음과 같습니다. 모바일 디자인은 의도적이 320에 배치되어있는 경우

예를 들어, 뷰포트의 폭을 지정할 수 있습니다 응답 및 링크에 대한

<meta name="viewport" content="width=320"> 

http://webdesign.tutsplus.com/articles/quick-tip-dont-forget-the-viewport-meta-tag--webdesign-5972

+0

내가 볼, 감사합니다. 내 문제는 내 메타 태그로 이것을 사용하고 있다는 것입니다 : '' – Thomas

+0

내 목표는 767px 이상의 브라우저 너비에서만 js를로드하는 것입니다. – Thomas

+0

mediaqueries 사용 –