码迷,mamicode.com
首页 > 移动开发 > 详细

动态获取移动端视宽,从而结合rem达到适配

时间:2018-09-08 19:23:22      阅读:170      评论:0      收藏:0      [点我收藏+]

标签:div   win   span   nbsp   code   tag   att   动态   get   

// jq
        !function(){
            var windowWidth= $(window).width();
            if(windowWidth > 750) {
                windowWidth = 750;
            }
            var fontSize = windowWidth / 750 * 50;//50是html根元素font-size值

            $("html").attr("style", "font-size:" + fontSize + "px");
            $(window).resize(function() {
                windowWidth = $(window).width();
                if(windowWidth > 750) {
                    windowWidth = 750;
                }
                fontSize = windowWidth / 750 * 50;
                $("html").attr("style", "font-size:" + fontSize + "px");
            });
        }();


//js
!function(){
    var windowWidth = document.documentElement.clientWidth || document.body.clientWidth;
    if(windowWidth > 750) {
        windowWidth = 750;
    }
    var fontSize = windowWidth / 750 * 50;   //50是html根元素font-size值

    document.getElementsByTagName(‘html‘)[0].style.fontSize = fontSize + "px";
    window.onresize = function(){
        var windowWidth = document.documentElement.clientWidth || document.body.clientWidth;
        if(windowWidth > 750) {
            windowWidth = 750;
        }
        fontSize = windowWidth / 750 * 50;
        document.getElementsByTagName(‘html‘)[0].style.fontSize = fontSize + "px";
    }
}();

 

动态获取移动端视宽,从而结合rem达到适配

标签:div   win   span   nbsp   code   tag   att   动态   get   

原文地址:https://www.cnblogs.com/520BigBear/p/9610083.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!