适配iPhone X系列底部导航

路小雨的雨web

已于 2023-12-13 15:29:23 修改

阅读量52

点赞数

文章标签： iphone ios

于 2023-12-13 15:28:44 首次发布

本文链接：https://blog.csdn.net/fang_java/article/details/108089345

版权

window.screen.height/window.innerHeight = window.screen.width/window.innerWidth

100%



window.screen.height - window.innerHeight / scale < 100

// iPhone X、iPhone XS
var isIPhoneX = /iphone/gi.test(window.navigator.userAgent) && window.devicePixelRatio && window.devicePixelRatio === 3 && window.screen.width === 375 && window.screen.height === 812;
// iPhone XS Max
var isIPhoneXSMax = /iphone/gi.test(window.navigator.userAgent) && window.devicePixelRatio && window.devicePixelRatio === 3 && window.screen.width === 414 && window.screen.height === 896;
// iPhone XR
var isIPhoneXR = /iphone/gi.test(window.navigator.userAgent) && window.devicePixelRatio && window.devicePixelRatio === 2 && window.screen.width === 414 && window.screen.height === 896;

 let isIphone = /iphone/gi.test(window.navigator.userAgent);
 let windowW = window.screen.width;
 let windowH = window.screen.height;
 let pixelRatio = window.devicePixelRatio;
 function cd_check() {//适配iPhone 机型方法
     let isIPhoneX = isIphone && pixelRatio && pixelRatio === 3 && windowW === 375 && windowH === 812;
     let isIPhoneXSMax = isIphone && pixelRatio && pixelRatio === 3 && windowW === 414 && windowH === 896;
     let isIPhoneXR = isIphone && pixelRatio && pixelRatio === 2 && windowW === 414 && windowH === 896;
     var scale = window.innerWidth / window.screen.width;
     console.log(window.screen.height, window.innerHeight, scale);
     if(platType!= "miniprogram"){
      if (window.screen.height - window.innerHeight / scale < 100) {//没有微信菜单
             if (isIPhoneX || isIPhoneXSMax || isIPhoneXR) {
                 // 底部增加fix-iphonex-bottm 样式
                 $(".navbottom-box").addClass('fix-iphonex-bottom');
                 $(".dcsec1").addClass('fix-iphonex-cd_se');
             }
         } else {
             if (isIPhoneX || isIPhoneXSMax || isIPhoneXR) {//有微信菜单
                 // 底部增加fix-iphonex-bottm 样式
                 $(".navbottom-box").removeClass('fix-iphonex-bottom');
                 $(".dcsec1").removeClass('fix-iphonex-cd_se');
             }
         }
  }else{
  var x=(windowW === 375 && windowH === 724 && isIphone);
  /* iPhone XS Max */
  var xsMax=(windowW === 414 && windowH === 808 && isIphone);
  var xi=(windowW === 375 && windowH === 812 && isIphone);
  /* iPhone XR */
  var xR=(windowW === 414 &&windowH === 896 && isIphone);
  if (x || xsMax || xR ||xi) {
             // 底部增加fix-iphonex-bottm 样式
             $(".navbottom-box").addClass('fix-iphonex-bottom');
             $(".dcsec1").addClass('fix-iphonex-cd_se');
             $(".hyNav-box").addClass('fix-iphonex-bottom1');
             //$("#allsy").addClass('fix-iphonex-cd1');
             /*$(".bigFloor").addClass('fix-iphonex-cd1');
             $(".scMy_btn").css("height","1.92rem");
             //$(".scMy_btn").css("padding-bottom ","34px !important");
             $("#lableList").css("height","84%");*/
         }
  }
     
 }
 //页面加载先调用一次
 cd_check();
 $(window).scroll(function () {//监听页面滑动每次滑动重新调用
  cd_check();
 })