Javascript 从手机或电脑检测用户，并在不同位置显示广告

我有一个反应迅速的网站。当用户从手机浏览并希望显示在菜单下时，我想禁用标题广告横幅

我的主题有一个选项来放置我添加的标题代码。但是如果用户来自移动设备，并且希望在菜单栏下显示它，我想禁用它

这是可以实现的吗。如果有的话。需要你的指导

问候,，

---

Naaz

当我必须时，我总是使用下面的代码：

 var desktop = !navigator.userAgent.match(/(iPhone|iPod|iPad|Android|BlackBerry|BB10|mobi|tablet|opera mini|nexus 7)/i);
 var orientationSupport = !!window.DeviceOrientationEvent;

if(desktop && !orientationSupport) {
    // your code for desktop pc's
}

但是，考虑使用特征检测是一个很好的开始，即使源代码也很容易理解

编辑：

找到了另一个答案，为类似的问题提供了见解

试试这个： 当我在谷歌上搜索时，我得到了这个用于检测移动站点的信息。这可能对你有帮助

<script>
var isMobile = {
Android: function() {
    return navigator.userAgent.match(/Android/i);
},
BlackBerry: function() {
    return navigator.userAgent.match(/BlackBerry/i);
},
iOS: function() {
    return navigator.userAgent.match(/iPhone|iPad|iPod/i);
},
Opera: function() {
    return navigator.userAgent.match(/Opera Mini/i);
},
Windows: function() {
    return navigator.userAgent.match(/IEMobile/i);
},
any: function() {
    return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
}
};

if( isMobile.any() ){
//Load mobile site
}else{
// Desktop Site
} 

var isMobile={
Android:function（）{
返回navigator.userAgent.match（/Android/i）；
},
黑莓：函数（）{
返回navigator.userAgent.match（/BlackBerry/i）；
},
iOS:function（）{
返回navigator.userAgent.match（/iPhone | iPad | iPod/i）；
},
Opera:函数（）{
返回navigator.userAgent.match（/Opera-Mini/i）；
},
Windows:function（）{
返回navigator.userAgent.match（/IEMobile/i）；
},
any:function（）{
返回（isMobile.Android（）| | isMobile.BlackBerry（）| | isMobile.iOS（）| | isMobile.Opera（）| | isMobile.Windows（））；
}
};
if（isMobile.any（））{
//加载移动站点
}否则{
//桌面站点
} 

---

几年来，一种不同的哲学出现了。 机器和操作系统太多了

现在很多设计师认为 移动机器和台式机器（以及后来的桌子）是宽度 屏幕的另一端

具有“宽度=设备宽度”视口的HTML页面保留像素和物理测量值（如英寸）之间的关系。这意味着当使用移动机器或台式机器时，像素的测量应该几乎相同。这意味着移动机器上的300px除以300px的div看起来应该与桌面机器上的差不多

这也意味着屏幕越小，以像素为单位的窗口宽度越小

长话短说，您可以使用768px的窗口宽度截止值来区分移动应用程序和桌面应用程序

就性能而言，CSS显然比javascript代码更受欢迎 根据窗口宽度显示和隐藏内容

// desktop css
.ad {
  display: block;
}

@media screen and (max-width: 768px) {
  // mobile css
  .ad {
    display:none;
  }
}

---

正确的处理方法可能是

CSS

媒体查询。