移動端開發的相容性處理

標籤：

PC機與移動端的解析度不同，導致頁面或視頻會出現拉長的情況，針對移動端的相容性問題，可嘗試將以下代碼加到網頁中．

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">    <meta charset="utf-8">    <meta name="format-detection" content="telephone=no">    <meta name="apple-mobile-web-app-capable" content="yes">    <meta name="apple-mobile-web-app-status-bar-style" content="black">        <meta http-equiv="Pragma" content="no-cache">    <meta http-equiv="Expires" content="-1">    <!--移動端版本相容 -->    <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 -->

 

移動端開發的相容性處理