1.判斷是否是IPhoneX手機
let isIphone = /iphone/gi.test(window.navigator.userAgent) let windowW = window.screen.width let windowH = window.screen.height let pixelRatio = window.devicePixelRatio 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 if (isIPhoneX || isIPhoneXSMax || isIPhoneXR) { // 底部增加fix-iphonex-bottm 樣式 $(".contact-box").addClass('fix-iphonex-bottom') // 底部增加iphone-footer-bg樣式 初始none,條件滿足block $(".iphone-footer-bg").addClass('iphonexshow') }2.增加fix-iphonex-bottom樣式
.fix-iphonex-bottom { bottom: 34px !important;}如果想更改IPhoneX底部34像素的背景顏色怎么辦呢?
3.增加iphone-footer-bg樣式
.iphone-footer-bg { height: 34px; background: #6D6D6D; width: 100%; position: absolute; bottom: -33px; display: none;}.iphonexshow { display: block !important;}以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持武林網。
新聞熱點
疑難解答