javascript - CSS "border-width"(px) 属性错误？

Question

问:这是 Firefox 35 中的错误吗？

$(angSelect[0], angSelect[2]).css("border-right-width", (function() {
    var angW = $(angSelect[1]).css("border-right-width");
    var boxW = selected[0].getBoundingClientRect().width;
    var res = boxW - parseFloat(angW);
    console.log("angW: " + angW + " boxW: " + boxW + " res: " + res);
    return (res / 2) + "px";
})());
console.log($(angSelect[0]).css("border-right-width"));

控制台在整个代码中记录两次:

angW: 199.833px boxW: 300 res: 100.167

49.5px

这显然是不正确的。第二个日志应该显示类似 50.0835 的内容。代码在窗口调整大小事件中按顺序执行。

IE11 中的结果:

angW: 200px boxW: 299.99993896484375 res: 99.99993896484375

49.99

[新] JSFiddle:

请记住在新选项卡中打开结果，这样您就可以在不受 JSFiddle 干扰的情况下放大和缩小。此外，打开您的开发人员控制台以获取浮点格式的结果。

http://jsfiddle.net/nbsshu77/15/

Answer 1

我不确定您的期望是什么。宽度值不会因为缩放而改变，这样做会很奇怪。当你在 Firefox 中缩放时，相同的值(例如 100px)只是显示更大或更小，取决于比例因子，但如果你查询元素，你将获得相同的大小:这就像高密度显示。 事实上，您实际上可以使用 devicePixelRatio得到比例因子。