如果使用移动浏览器隐藏DIV [英] Hiding DIV if using mobile browser

问题描述

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

I'm having trouble manipulating my code to hide one specific DIV if the browser being used is a mobile device.

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

Backstory: I'm building a custom WordPress template, and I have my design fully responsive, except for one specific DIV that I'm using some hover techniques that just don't look fancy using a touch screen, so I want to just hide that section if the user is using a mobile device.

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

I did some searching and found this little nifty code that can detect if the browser is a mobile device (please feel free to point me towards a better code if one does exist, but nothing gigantic or anything), I currently just have it giving an alert box telling me if it's a mobile browser or not:

<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> 

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

Now all I'm wanting to do is have it essentially say:

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

我知道这不是一个正常运行的代码，我使用 getElementById 进行了一些测试，但无法弄清楚如何实现我的目标。我确实将我的.navWrap类更改为#navWrap，因此可以通过 getElementById 选择它，但这也不起作用。

I know that's not a functioning code, I did some testing using getElementById but couldn't figure out how to accomplish my goal. I did change my .navWrap class to #navWrap so it could be selected by getElementById but that didn't work either.

那么，你们中任何一位出色的天才能够帮助我吗？谢谢！

So, any of you amazing geniuses out there able to help me out? Thanks!

推荐答案

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

you can alos use this minified jQuery snippet to detect if your user is viewing using a mobile device ; 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> 

这篇关于如果使用移动浏览器隐藏DIV的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！