我是靠谱客的博主 现代云朵,最近开发中收集的这篇文章主要介绍html判断是苹果,JavaScript判断是否是iPhone X系列机型,H5和其他环境兼容,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

最近遇到的iPhone X全面屏的刘海适配问题,由于浏览器或者APP全屏显示时,刘海会遮住原页面顶部的信息。

68f32f1be92b096e93f28e2033710a36.png

所以如何判断手机是 iPhone X 呢?

利用 JavaScript 实现:

其中的一个普遍的方法是:function isIphoneX(){

return /iphone/gi.test(navigator.userAgent) && (screen.height == 812 && screen.width == 375)

}

先通过返回的布尔值判断会否是 iPhone X ,然后再进行操作:比如给头部一个上边距,一般是44px。if (isIphoneX) {

$("header").css("margin-top","44px");

......

}

前端页面兼容 iPhone X 的刘海,我会在下一篇文章详细总结。

另一种写法,博主也测试成功:iphone 测试失败,改为 iPhone 后返回 true 了。var isIphoneX = /iPhone[sS]*OS X/.test(navigator.userAgent)

还找到一个方法:

现状

iPhone X 底部是需要预留 34

最后

以上就是现代云朵为你收集整理的html判断是苹果,JavaScript判断是否是iPhone X系列机型,H5和其他环境兼容的全部内容,希望文章能够帮你解决html判断是苹果,JavaScript判断是否是iPhone X系列机型,H5和其他环境兼容所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(47)

评论列表共有 0 条评论

立即
投稿
返回
顶部