当前位置 博文首页 > 文章内容
最大化 缩小

    设置字体随着浏览器的缩放而缩放

    作者： 栏目：未分类 时间：2020-08-26 16:01:25

    本站于2023年9月4日。收到“大连君*****咨询有限公司”通知
    说我们IIS7站长博客，有一篇博文用了他们的图片。
    要求我们给他们一张图片6000元。要不然法院告我们

    为避免不必要的麻烦，IIS7站长博客，全站内容图片下架、并积极应诉
    博文内容全部不再显示，请需要相关资讯的站长朋友到必应搜索。谢谢！

    另祝：版权碰瓷诈骗团伙，早日弃暗投明。

    相关新闻：借版权之名、行诈骗之实，周某因犯诈骗罪被判处有期徒刑十一年六个月

    叹！百花齐放的时代,渐行渐远!


     /**
         * @description 设置字体大小
         */
        fontSize(res) {
          let clientWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth
          if (!clientWidth) return
          let fontSize = 100 * (clientWidth / 1920)
          return res * fontSize
        },
     
    /**
         * 根据屏幕大小设定font-size 适配rem
    　* 方法写在app.vue中 在 mounted 中调用
         */
        setFontSize() {
          const docEl = document.documentElement
          let resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize'
          const scale = (1920 / 1080).toFixed(2)
          const recalc = function () {
            const clientWidth = docEl.clientWidth
            const clientHeight = docEl.clientHeight
            if (!clientHeight || !clientWidth) return
            const scaleCilent = (clientWidth / clientHeight).toFixed(2)
            let size = ''
            if (scale > scaleCilent) {
              size = 100 * (clientWidth / 1920)
            } else {
              size = 100 * (clientHeight / 1080)
            }
            docEl.style.fontSize = (size < 100 ? size : 100) + 'px'
          }
          if (!document.addEventListener) return
          window.addEventListener(resizeEvt, recalc, false)
          document.addEventListener('DOMContentLoaded', recalc, false)
        },
      },