字體自適應屏幕大小變化(抄來的)


 <script>
      (function(win) {
        var doc = win.document
        var docEl = doc.documentElement
        var tid
        doc.body.addEventListener('touchstart', function () {})

        function refreshRem() {
          var width = docEl.getBoundingClientRect().width
          if (width > 750) { // 最大寬度
            width = 750
          }
          var rem = width / 7.5
          docEl.style.fontSize = rem + 'px'
          // 開發實際尺寸為:750設計稿的尺寸 / 100 rem
        }

        win.addEventListener('resize', function() {
          clearTimeout(tid);
          tid = setTimeout(refreshRem, 300)
        }, false);
        win.addEventListener('pageshow', function(e) {
          if (e.persisted) {
            clearTimeout(tid)
            tid = setTimeout(refreshRem, 300)
          }
        }, false)
        refreshRem()
      })(window)
    </script>

使用:.app{font-size: 0.24rem;}


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM