问题：移动端使用rem的情况下，面板太小的解决方案

[jzlxiaohei]

现在移动端，为了适配大小问题，使用rem的解决方案。 具体见 https://github.com/amfe/lib-flexible

三倍屏下，会先把页面的 scale 设成 1/3, 这种情况下，调试面板就太小了。

我们自己写css时，会通过postcss 把px 转成rem。

这个虽然不是库需要考虑的，但是移动端rem还是挺常用，这种情况的确太影响使用了。

[surunzi]

试了下，动态修改样式的数值是个可行的方案，但由于有部分数值hardcode在了js中没办法只通过修改样式文件完美处理，下个版本我看能不能将那部分代码移除掉。

[jzlxiaohei]

恩，在不影响不用rem的情况下，希望尽量考虑下。非常感谢

[surunzi]

目前看来使用zoom属性将样式scale回去效果还行，ios实机下测试字体无效，需要替换evalCss函数进行字体大小的修改，试下有没有效 @jzlxiaohei

var initialScale = 0.33333;

var scale = (1 / initialScale).toFixed(2)

if (/iPhone/.test(navigator.userAgent)) {
    var mark = [];
    eruda.util.evalCss = function evalCss(css) {
        css = css.toString();
        css = css.replace(/font-size:(\d+)px/g, function($0, $1) {
            return 'font-size:' + (+$1 * scale) + 'px';
        });
        for (var i = 0, len = mark.length; i < len; i++) {
            if (mark[i] === css) return;
        }
        mark.push(css);

        var container = evalCss.container || document.head,
            style = document.createElement('style');

        style.type = 'text/css';
        style.textContent = css;

        container.appendChild(style);
    }
}

eruda.init();

var $ = eruda.util.$;
$('.eruda-dev-tools').css('zoom', scale);
$('.eruda-entry-btn').css({
    width: 40 * scale,
    height: 40 * scale,
    fontSize: 25 * scale,
    lineHeight: 40 * scale,
    borderRadius: 10 * scale
});
eruda._entryBtn._setPos();

[AkiraSun]

rem布局下试了楼主这个方法的确还是字体的大小不能更改，按钮位置也会发生些变化，感觉移动端这个适配的必要性还是非常大哈

[surunzi]

这样做按钮移位是已知问题，不过ios下替换了eruda.util.evalCss字体也没法改变？可否贴个Demo链接？ @AkiraSun

[AkiraSun]

http://www.jianshu.com/p/985d26b40199
我使用的是这种高清rem布局，所以会导致布局不准确
按钮可以修改，eruda.util.evalCss下的字体选项略多。。不知从何下手

[surunzi]

@AkiraSun 不太明白你说的情况是什么，我自己用上边的代码在android跟ios下基本是可以正常使用的。

PS: 那个var initialScale = 0.33333是需要自己根据页面当前scale进行调整。

[AkiraSun]

@surunzi 可以麻烦贴下eruda.util.evalCss 修改的代码吗

[tesky0125]

感谢楼主，font-size正则匹配有点小问题，未考虑空格，增加\s*即可，以下未更新后的代码片段

        css = css.replace(/font-size:\s*(\d+)px/g, function($0, $1) {
            return 'font-size:' + (+$1 * scale) + 'px';
        });

[tesky0125]

另外initialScale = 0.33333; 建议改成

var dpr = window.devicePixelRatio || 1;
var initialScale = 1 / dpr;

[surunzi]

@jzlxiaohei 1.3.0加了autoScale功能，可以试下有没有效果

[jzlxiaohei]

我这个验证了下，展示效果很赞。