H5頁面字體大小使用rem (重置字體大小)setFontSize.js


/*by  min*/
//初始化rem
(function(){
    var getStyle = (function(){
        if(window.currentStyle){
            return function(obj, name){
                return obj.currentStyle[name];
            }
        }
        else{
            return function(obj, name){
                return getComputedStyle(obj, false)[name];
            }
        }
    })();

    var addEvent = (function(){
        if(document.attachEvent){
            return function(obj, ev, fn){
                obj.attachEvent('on'+ev, fn);
            };
        }
        else{
            return function(obj, ev, fn){
                obj.addEventListener(ev, fn, false);
            };
        }
    })();

    var oHtml = document.querySelector('html');
    var fontSize = getStyle(oHtml, 'fontSize').split('px')[0];
    var originalWidth = 750;

    setFontSize();

    addEvent(window, 'resize', function(){
        setFontSize();
    });

    function setFontSize() { 
        var size = size || 200;
        var _fontSize = (getSize()['width'] * fontSize / 750)>size?size:(getSize()['width'] * fontSize / 750);
        oHtml.style.fontSize = _fontSize + "px";
    }

    function getSize() {
        return {
            width :document.documentElement.clientWidth || document.body.clientWidth,
            height :document.documentElement.clientHeight || document.body.clientHeight
        }
    }
})();

  setFontSize.js

注意html字體大小要先設置成100px,並且JS在CSS重置為100px以后引入。


免責聲明!

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



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