美文网首页
移动端如何适配

移动端如何适配

作者: 雷特卡卡 | 来源:发表于2018-03-21 15:15 被阅读0次
    (function (doc, win) {
    
    var docEl = doc.documentElement,
    
    resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
    
    recalc = function () {
    
    var clientWidth = docEl.clientWidth;
    
    if (!clientWidth) return;
    
    docEl.style.fontSize = clientWidth / 750*100 + 'px';  //750是设计稿高度
    //这样整个手机屏幕大小为7.5rem, 如果设计稿字体36px,则为0.36rem 
    };
    
    if (!doc.addEventListener) return;
    
    win.addEventListener(resizeEvt, recalc, false);
    
    doc.addEventListener('DOMContentLoaded', recalc, false);
    
    })(document, window);
    
    //还有直接设置宽度:< meta name="viewport" content="width=750,user-scalable=no>  这样宽带写死750
    
    //jquery.tap.js
    
    //swiper-3.4.2.min.js
    
    //swiper.animate1.0.2.min.js
    
    //jquery.imgpreload.min.js插件实现页面图片预加载
    

    相关文章

      网友评论

          本文标题:移动端如何适配

          本文链接:https://www.haomeiwen.com/subject/aeygqftx.html