[jQuery / javascript] 모바일 기기 여부 확인하기

안녕하세요, 디발자 매니입니다. 오늘은 접속한 기기가 모바인인지의 여부를 확인하는 방법을 알아보겠습니다.

 

모바일 기기를 감지하는 방법

반응형 웹사이트를 만들다보면 하단에 상태바같은 경우 웹이 아닌 모바일에서만 사용하는 경우가 있습니다. PC에서 화면이 작을 때 나오면 부자연스럽기 때문에 접속 기기를 탐지해 제어해 주어야 합니다.

 

function Mobile() {return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);}

모바일 여부를 확인하는 함수입니다.

console.log(Mobile()) // 콘솔창에서 확인 가능

console.log(Mobile()) // 콘솔창에서 확인 가능

모바일일 경우 true 그 외 기기일 경우 false를 콘솔창에 반환합니다.
pc에서도 f12(window경우) 또는 ctrl + shift + i 를 눌러 관리자모드 확인이 가능합니다.
관리자 모드에서 ctrl + shift + m 또는 아래 이미지에 보이는 이 디바이스 아이콘을 누른 후 새로고침을 하면 pc에서도 모바일로 인식이 되어 true를 반환합니다.

관리자 모드 Toggle device toolbar

 

function Mobile(){
	return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);}
	
    if (Mobile()){// 모바일일 경우
        
    } else {// 모바일 외
        
    }