HTML手机网页移动端版本兼容代码

复制一键解决了,省时省写代码

代码一

<!--移动端版本兼容 end -->

<script type="text/javascript">

        window.mobileUtil = (function(win, doc) {
         var UA = navigator.userAgent,
         isAndroid = /android|adr/gi.test(UA),
         isIOS = /iphone|ipod|ipad/gi.test(UA) && !isAndroid,
                isBlackBerry = /BlackBerry/i.test(UA),
                isWindowPhone = /IEMobile/i.test(UA),
         isMobile = isAndroid || isIOS || isBlackBerry || isWindowPhone,
             isIphoneX = /iphone/gi.test(navigator.userAgent) && (screen.height == 812 && screen.width == 375);
         return {
             isIphoneX: isIphoneX,
         isAndroid: isAndroid,
         isIOS: isIOS,
         isMobile: isMobile,
         isWeixin: /MicroMessenger/gi.test(UA),
         isQQ: /QQ/gi.test(UA),
                isApp: /xiaoshijie/gi.test(UA)
            };
        })(window, document);
        !(function (doc, win) {
            var docEl = doc.documentElement,resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',fsize,
            fn = function () {
                var cWidth = !mobileUtil.isMobile ? 750 : docEl.clientWidth;
                fsize = cWidth/7.5;
                cWidth && (docEl.style.fontSize = 2 * fsize + 'px');
            };
            fn();
            if (!doc.addEventListener) return;
            win.addEventListener(resizeEvt, fn, false);
        })(document, window);
        </script>

<!--移动端版本兼容 end -->

代码2

<!--移动端版本兼容 -->
<script type="text/javascript">
         var phoneWidth =  parseInt(window.screen.width);
        var phoneScale = phoneWidth/640;
        var ua = navigator.userAgent;
         if (/Android (\d+\.\d+)/.test(ua)){
                   var version = parseFloat(RegExp.$1);
                   if(version>2.3){
                            document.write('<meta name="viewport" content="width=640, minimum-scale = '+phoneScale+', maximum-scale = '+phoneScale+', target-densitydpi=device-dpi">');
                   }else{
                            document.write('<meta name="viewport" content="width=640, target-densitydpi=device-dpi">');
                   }
         } else {
                   document.write('<meta name="viewport" content="width=640, user-scalable=no, target-densitydpi=device-dpi">');
         }
</script><meta name="viewport" content="width=640, user-scalable=no, target-densitydpi=device-dpi">
<!--移动端版本兼容 end -->
本博客所有文章归地球者:ALIN迷茫复制或转载请以超链接形式注明转自 北纳星_52bnx.cn
原文地址《HTML手机网页移动端版本兼容代码

相关推荐

发表评论

路人甲

网友评论(0)