如果使用移动浏览器隐藏DIV

Question

如果正在使用的浏览器是移动设备,我无法操纵我的代码来隐藏一个特定的DIV.

背景故事:我正在构建一个自定义的WordPress模板,我的设计完全响应,除了一个特定的DIV,我正在使用一些悬浮技术,只是看起来不像使用触摸屏,所以我想隐藏如果用户正在使用移动设备,该部分.

我做了一些搜索,发现这个小巧的代码可以检测出浏览器是否是一个移动设备(如果确实存在,请随时指向一个更好的代码,但没有什么巨大或任何东西),我现在只是给它一个警告框告诉我它是否是移动浏览器:

<script type="text/javascript"> 
    var mobile = (/iphone|ipod|android|blackberry|mini|windows\sce|palm/i.test(navigator.userAgent.toLowerCase()));  
    if (mobile) { alert("MOBILE DEVICE!!"); } else { alert("NOT A MOBILE DEVICE!!"); }
</script> 

现在,我想做的就是让它基本上说:

if (mobile) { .navWrap {display: none;} }

我知道这不是一个有效的代码,我做了一些测试,getElementById但无法弄清楚如何实现我的目标.我确实将我的.navWrap类更改为#navWrap,因此它可以被选中,getElementById但是也没有用.

那么,你们中任何一位出色的天才能帮到我吗？谢谢!

Answer 1

你也可以使用这个缩小的jQuery片段来检测你的用户是否正在使用移动设备查看; jQuery.browser.mobile

• 如果浏览器是移动设备,则jQuery.browser.mobile将为true

你可以试试这段代码:

   <script type="text/javascript"> 
    var mobile = (/iphone|ipod|android|blackberry|mini|windows\sce|palm/i.test(navigator.userAgent.toLowerCase()));  
    if (mobile) { 
        alert("MOBILE DEVICE!!");
        $('.navWrap').css('display', 'none'); // OR you can use $('.navWrap').hide();
    } 
    else 
    { 
       alert("NOT A MOBILE DEVICE!!"); 
    }
</script>