问答详情
源自:2-6 未来方法+结语

题外话

我发现老师的demo是用px为单位、那么是怎样去适应不同屏幕的手机呢

提问者:IT小白兔 2017-10-08 17:44

个回答

  • _亓
    2017-10-14 14:10:31

    屏幕适配是有多种方式的。

    !function(){

    var vp;

    var sw = window.screen.width;

    if (/android (\d+\.\d+)/i.test(navigator.userAgent)) {

    var v = parseFloat(RegExp.$1);

    var s = 0.5;

    var c = v < 4.2 ? Math.ceil(window.devicePixelRatio) : window.devicePixelRatio;

    var dpi;

    if (c) {

    dpi = 640 / sw * c * 160;

    } else {

    dpi = sw <= 640 ? sw / 640 * 320 : 640 / sw * 320;

    }

    vp = '<meta name="viewport" content="width=640,initial-scale=' + s + ' ,minimum-scale=' + s + ',maximum-scale=' + s + ',user-scalable=no,target-densitydpi=' + dpi + '">';

    } else {

    var s = sw / 640;

    vp = '<meta name="viewport" content="width=640,initial-scale=' + s + ' ,minimum-scale=' + s + ',maximum-scale=' + s + ',user-scalable=no">';

    }

    document.write(vp);

    我还没看老师的源码。但是像这种就是直接根据屏幕大小来缩放页面的。就可以直接用px来写页面