Modernizr을 Foundation 3에서 사용하여 장치가 전화인지 확인하십시오.

Question

나는 Foundation 3에서 반응 형 사이트를 구축 중입니다.

남아있는 고집 포인트는 리더 보드 광고입니다. 데스크톱 및 태블릿에 리더 보드 광고를 표시하는 광고 슬롯 하나를 보유하고 싶지만 휴대 전화 전용 광고는 리더 보드가 분명히 적합하지 않으므로 표시해야합니다.

Doubleclick (광고 공급 업체)과 이야기를 나누었고 광고가 하나 또는 다른 광고 호출을로드하는 지점에서 자바 스크립트 브라우저 스니퍼 인라인을 사용하도록 제안했습니다.

Foundation에서는 Modernizr을 사용하기 때문에 어떤 광고를 게재할지 검색하는 방법을 찾고있었습니다. 하지만 그 문서를 보면 아무 것도 볼 수 없습니다. 터치 만이 관련이 있지만, 태블릿이 포함됩니다. 휴대 전화 만 타겟팅하고 싶습니다.

Modernizr에서 이것을 수행 했습니까? 아니면 navigator.userAgent에 의지해야합니까? 당신이 간단한 검사를 위해 모더 나이저를 사용하려면

Answer 1

, 당신은 터치 지원 물론

if (Modernizr.touch) { 
    // mobile 
} else { 
    // desktop 
} 

을 확인 할 수 있습니다, 그것은 터치 이벤트를 지원하지 않는 휴대폰이 있기 때문에 가장 올바른 해결책은 아니다. 모바일 장치에 대한 철저한 검사가 필요하다면 지금가는 올바른 방법은 navigator.userAgent입니다.

Answer 2

사용자 에이전트 도로를 내려 오는 것은 과도한 행동입니다.

나는 단지 두통 것이다 태블릿에서 휴대폰을 분리 폰에도 Modernizrs의 특징 검출과

, 정확하게을 대상으로합니다.

핵심 문제로 올바른 크기의 광고가 표시되는 경우 사용자 뷰포트를 사용하여 광고 크기를 결정하는 것이 좋습니다.

if($(window).width() < desktopAdWidth){ 
     // do mobile ad stuff.. 
} 

Answer 3

저는 Modernizr.mq()를 사용하여 화면 크기와 픽셀 밀도의 조합을 평가합니다. 픽셀 밀도가 1.0 이상인 것은 무엇이든 휴대 할 수 있다고 생각합니다.

WebOS가 터치를보고하지 않기 때문에 문서에 따르면 터치 감지가 안정적이지 않으며 Windows 8 터치 지원 PC에서 브라우저의 향후 버전이 터치를보고 할 것으로 의심됩니다.