zoukankan      html  css  js  c++  java
  • 移动端响应式js代码

    最大宽度为640 1rem = 32px:
    (function() {
    var b = document.documentElement,
    a = function() {
    var a = b.getBoundingClientRect().width;
    b.style.fontSize = .0625 * (640 <= a ? 640 : a) + "px"
    },
    c = null;
    window.addEventListener("resize",
    function() {
    clearTimeout(c);
    c = setTimeout(a, 300)
    });
    a()
    })();
    最大宽度为640 1rem = 32px:
    (function() {
    var b = document.documentElement,
    a = function() {
    var a = b.getBoundingClientRect().width;
    b.style.fontSize = .005 * (640 <= a ? 640 : a) + "px"
    },
    c = null;
    window.addEventListener("resize",
    function() {
    clearTimeout(c);
    c = setTimeout(a, 300)
    });
    a()
    })();

    不限制最大宽度:

    (function (root) {
    var docEl = document.documentElement,
    timer = null,
    width, last;

    function changeRem () {
    width = docEl.getBoundingClientRect().width;
    if (last === width) { return; }
    last = width;
    root.rem = width / 20;
    if (/ZTE U930_TD/.test(navigator.userAgent)) {
    root.rem = root.rem * 1.13;
    }
    docEl.style.fontSize = root.rem + 'px';
    }

    changeRem();

    root.addEventListener('resize', function () {
    clearTimeout(timer);
    timer = setTimeout(changeRem, 300);
    });

    root.addEventListener('orientationchange', function () {
    clearTimeout(timer);
    timer = setTimeout(changeRem, 300);
    });
    })(window, undefined);

  • 相关阅读:
    navigator
    windows事件
    js 数组
    类,屏蔽鼠标右键
    document.links[i].onclick;展示表单的输入
    手机端取消文字选中、取消图片长按下载
    ios显示一个下载banner
    js时间Date对象介绍及解决getTime转换为8点的问题
    iphone的click导致div变黑
    如何给外部引用的js文件传递参数
  • 原文地址:https://www.cnblogs.com/anyaran/p/4651542.html
Copyright © 2011-2022 走看看