2

在 chrome 浏览器http://jsfiddle.net/A8fhT/3/中打开此链接并查看元素宽度 (270)，然后缩小 (ctrl + "-")，现在查看宽度 (269)。在 Firefox 上一切正常，chrome 的任何解决方案，还是这是错误？

编辑：AK 示例http://jsfiddle.net/akhurshid/5E9kj/ 图片：http ://s7.postimage.org/qgezkqcor/image.png

4

3 回答 3

0

我是geni.com的主要前端开发人员，主要从事HTML5 树的开发。

我与 进行了广泛的合作zoom，但无法在所有浏览器中获得一致的行为。但是，我发现 CSS 变换scale比缩放更可靠。

如果您真的需要缩放，请尝试应用scale到$(body)（或任何其他元素）。我能够在 Chrome 和 FF 中获得一致的宽度。

JSFiddle 演示

于 2012-08-07T16:14:15.760 回答
0

问题仅在于绝对定位的元素，所以我修改了 jQuery 函数（// 行）。

    function getWidthOrHeight(elem, name, extra) {

        //deletes position//
        var $elem = $(elem); //
        var position = $elem.css('position'); //
        $elem.css('position', ''); //

        // Start with offset property
        var val = name === "width" ? elem.offsetWidth : elem.offsetHeight,
        i = name === "width" ? 1 : 0,
        len = 4;

        if (val > 0) {
            if (extra !== "border") {
                for (; i < len; i += 2) {
                    if (!extra) {
                        val -= parseFloat(jQuery.css(elem, "padding" + cssExpand[i])) || 0;
                    }
                    if (extra === "margin") {
                        val += parseFloat(jQuery.css(elem, extra + cssExpand[i])) || 0;
                    } else {
                        val -= parseFloat(jQuery.css(elem, "border" + cssExpand[i] + "Width")) || 0;
                    }
                }
            }

            //sets position//
            $elem.css('position', position); //

            return val + "px";
        }
于 2012-09-09T12:56:39.920 回答
0

我有同样的问题，我找到了解决方案。

我创建了一个隐藏的画布对象，并在其中包含宽度问题的 div。加载页面后，我从画布中提取 div（展开），在任何缩放级别下一切看起来都很棒！

希望能帮助到你！

于 2019-03-29T11:16:32.740 回答