2013-07-25 2 views
0

모바일 및 데스크톱 사용자 모두에게 동적 콘텐츠로 반응 형 웹 사이트를 최적화하는 간단한 방법을 찾고있었습니다.최적의 모바일 및 데스크톱 환경을위한 UI 제어

저는 모바일이 아닌 데스크탑 환경에서만 의미가있는 스타일링 & js 기능을 상당히 가지고 있습니다. 그 반대의 경우도 마찬가지입니다. 반면에 내 레이아웃은 평균 태블릿 크기보다 작을 뿐이므로 스위치를 만들 위치를 지적하기가 어렵습니다.

로드해야하는 스타일 시트와 스크립트를 전환하는 대신 모바일/데스크톱 사용자에게 모든 것을 포격하지 않는 것이 좋습니다. 사이트는 일정하게 유지되고 필수 컨텐츠에 아약스로로드되기 때문에 다른 모든로드 시간을 최소한으로 유지하는 것이 좋습니다.

필자의 초기 생각은 터치 피처 감지에 따라 다른 CSS 및 JS 파일을로드하는 modernizr 함수를 작성하는 것이 었습니다. 하지만 모바일이 아닌 많은 브라우저가 이제는 터치로 지원되는 것으로 나타났습니다./

저는 장치 너비 미디어 쿼리를 고수하지 않고도이 문제를 해결하는 방법에 대해 궁금해합니다. 둘 중 하나를 선택하거나 일부 브라우저 버전이나 장치가 포함되지 않을까 걱정할 필요가 없습니다.

+1

'device-width' 미디어 쿼리를 사용하는 가장 좋은 방법은 *이다. 자바 스크립트에서도 가장 신뢰할 수 있습니다. 가장 좋은 방법입니다. – Ohgodwhy

답변

0

Here은이를위한 화격자 도구입니다. 매우 siple, 나는 이런 식으로 jQuery vesion을 사용한다 :

if(jQuery.browser.mobile){ //code }