检测 iPad Safari 用户的最佳方法

发布于 2024-11-02 09:30:30 字数 362 浏览 0 评论 0原文

添加用于检测 iPad Safari 用户的代码的最佳方法是什么?我的意思是我们应该使用 1.CSS(通过链接媒体..) 2. JS(通过导航器对象)

我听说使用用户代理字符串不是检测iPad的最佳方法,因为不一致。

请建议。谢谢。


我还有一个后续问题;

实际上,检测桌面/iPad 的代码将成为 JSP 的一部分(而不是静态 HTML 文件)......现在在我的应用程序中,有 200 多个页面......那么我到底应该在哪里添加检测代码以及如何添加我究竟应该添加它吗?我的意思是我是否必须更新 servlet web.xml 文件中的某处。

很抱歉混合了两个问题。但只是在此处添加,因为这两个问题都是相关的问题。

What is the best approach to add code for detecting an iPad Safari user. I mean should we use
1. CSS (through link media..)
2. JS (through navigator object)

I have heard that using user-agent string is not the best way to detect iPad, because of inconsistencies.

Please suggest. Thank you.


I also have a follow-up question;

Actually the code to detect desktop/iPad is going to be part of JSP (and not static HTML files)...Now in my app, there are 200+ pages..So where exactly should I be adding the code for detection and how exactly should I add it? I mean do I have to update somewhere in the servlet web.xml file..

Sorry for mixing the 2 questions..But just added here as both are related questions..

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

一张白纸 2024-11-09 09:30:30

您的用户代理中始终包含 iPad。

然而,如果您的目标是 iPad,以便能够以不同的方式显示内容,那么 CSS 媒体查询绝对是前进的方向。

请参阅此处 ZeptoJS 如何检测 iPad在JS中。

要在两个方向上定位 iPad,请执行以下操作:

<link rel="stylesheet" media="all and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait)" href="ipad-portrait.css"> 
<link rel="stylesheet" media="all and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape)" href="ipad-landscape.css">

You always have iPad in the user-agent.

However, if you're targeting iPads so that you can show things differently, then CSS media queries are definitely the way to go forward.

See here how ZeptoJS detects iPad in JS.

To target iPad in both orientations, do this:

<link rel="stylesheet" media="all and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait)" href="ipad-portrait.css"> 
<link rel="stylesheet" media="all and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape)" href="ipad-landscape.css">
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文