在 Web 应用程序上,我想显示两种不同的菜单,一种用于移动设备,一种用于桌面浏览器。我将 Next.js 应用程序与服务器端渲染和库react-device-detect 一起使用。
import Link from "next/link";
import { BrowserView, MobileView } from "react-device-detect";
export default () => (
<div>
Hello World.{" "}
<Link href="/about">
<a>About</a>
</Link>
<BrowserView>
<h1> This is rendered only in browser </h1>
</BrowserView>
<MobileView>
<h1> This is rendered only on mobile </h1>
</MobileView>
</div>
);
Run Code Online (Sandbox Code Playgroud)
如果您在浏览器中打开它并切换到移动视图并查看控制台,您会收到此错误:
警告:文本内容不匹配。服务器:“仅在浏览器中呈现”客户端:“仅在移动设备上呈现”
发生这种情况是因为服务器的渲染检测到浏览器,而在客户端,他是一个移动设备。我发现的唯一解决方法是生成两者并使用如下 CSS:
.activeOnMobile {
@media screen and (min-width: 800px) {
display: none;
}
}
.activeOnDesktop {
@media screen …Run Code Online (Sandbox Code Playgroud) 我有一个为ios和android设备部署的流星应用程序,我希望某些代码只在ios设备上运行,而不是在android上运行.我知道我可以使用流星设备检测包来检测设备
Meteor.Device.isPhone()
Run Code Online (Sandbox Code Playgroud)
但有没有可能的方法可以知道它是一个Android或iOS设备.
编辑:我使用meteor cordova创建了捆绑.
我试图检测最终用户是在手机,平板电脑还是个人电脑上
我已经谷歌搜索了一段时间,显然没有简单的解决方案.
好吧,我想我不应该使用Resolution,因为现在有些平板电脑具有惊人的分辨率.
我不应该依赖方向,因为windows8笔记本电脑可以像平板电脑一样旋转.(响应式设计对我目前的项目来说太难了)
我一直在尝试使用UserAgent(认为它也有它的缺点),但是无法让它工作,下面是我用来区分手机/平板电脑和PC的不同版本的联合,他们只是不工作和我不知道为什么
var agents = ['android', 'webos', 'iphone', 'ipad', 'blackberry','iemobile','phone','mobile'];
for(i in agents) {
if(navigator.userAgent.toLowerCase().match('/'+agents[i]+'/i')) {
return true;
}
}
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent) ) {
return true;
}
if( navigator.userAgent.match(/Android/i)
|| navigator.userAgent.match(/webOS/i)
|| navigator.userAgent.match(/iPhone/i)
|| navigator.userAgent.match(/iPad/i)
|| navigator.userAgent.match(/iPod/i)
|| navigator.userAgent.match(/BlackBerry/i)
|| navigator.userAgent.match(/Windows Phone/i)
|| navigator.userAgent.match(/bada/i)
|| navigator.userAgent.match(/Bada/i)
){
return true;
}
Run Code Online (Sandbox Code Playgroud) 我一直在做一些研究,我想我已经知道了答案,但我想知道是否有任何方法可以在不使用javascript或依赖CSS3媒体查询的情况下获得设备的屏幕尺寸和像素密度.
本质上,我正在研究获取屏幕分辨率和像素密度所需的内容,以便服务器可以决定在URI请求中向服务器提供哪个图像.
到目前为止,我还没有找到任何说这甚至可能的东西,但我觉得嘿,为什么不问?
我想检查我的JavaScript函数之一,以确定我是否在智能手机上,然后根据结果决定是否运行该函数。
用JavaScript检测/检查智能手机(或一般手持设备)的最佳方法是什么?
例如
if (user is on a smartphone) {
//run this code if on a phone
} else {
//run this code if not on a phone
}
Run Code Online (Sandbox Code Playgroud)
如果没有确定的方法来检查电话,那么在决定运行哪个代码之前,我应该执行的最佳检查方法是什么?
编辑/更新:在类似的帖子上的答案和评论应该给我一些东西- 在jQuery中检测移动设备的最佳方法是什么?
我收到警告,Android Studio停止并继续处理,但什么也没做.我已经连接了我的三星手机(KITKAT),但它根本没有显示任何东西.
我收到以下警告消息
Warning: debug info can be unavailable. Please close other application
using ADB: Monitor, DDMS, Eclipse
Restart ADB integration and try again
Waiting for process: com.example.frkdeveloper.tictactoegsm`
Run Code Online (Sandbox Code Playgroud) 我们有一个用PHP开发的网站.它工作得很好.我们已经将JQuery用于各种情况,如幻灯片放映,菜单等.
该网站包含大量大小的图像.因此,当在手机中查看时,用户必须滚动很多.
我们如何识别尝试访问我们网站的客户端(浏览器)是手机还是标准PC.
有没有标准的方法来建立这种情况的网站?
TIA
我很想知道如何检查iPhone,iPad和其他移动浏览器.(JavaScript或CSS)
编辑:
请不是用户代理字符串.这可能是假的.
可能的欺骗:
javascript browser-detection device-detection mobile-browser
我有一个Web应用程序.我的JavaScript,我通过用户代理字符串识别设备如下:
_android = navigator.userAgent.toLowerCase().indexOf("android");
_iOS = navigator.platform.indexOf("iPhone");
Run Code Online (Sandbox Code Playgroud)
我的任务是确定设备是否是win8平板电脑?
我已经看过这篇文章了.但是,字符串"Windows NT"很可能出现在所有PC浏览器的useragent中.那么,我需要找出一种客户端方式来识别设备是否是win8平板电脑?
有什么想法吗?