Carregar script do JQuery Mobile somente para dispositivos móveis
Eu tenho uma página da web que precisa ser exibida corretamente em dispositivos móveis. Para fazer isso, carreguei o script do JQuery Mobile na cabeça da página. A tag head parece com isso:
<head>
<title>Page Title</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
</head>
E usado nos elementos body da página os atributos de função de dados para exibir as coisas. As páginas parecem muito boas em dispositivos móveis, mas parecem semelhantes, mesmo se a solicitação vier de um navegador não móvel.
Gostaria de saber se alguém conhece um método para carregar o script do JQuery Mobile somente se a solicitação vier de um dispositivo móvel.
O que eu tentei até agora é usar uma função que detecta meu agente de usuário e carrega o script se for um dispositivo móvel:
function init() {
if(isMobile()) {
document.write('<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />');
document.write('<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>');
dcument.write('<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>');
}
}
function isMobile() {
if(navigator.userAgent.match(/Android/i) || navigator.userAgent.match(/BlackBerry/i) || navigator.userAgent.match(/iPhone|iPad|iPod/i) || navigator.userAgent.match(/IEMobile/i))
return true;
return false;
}