Question

我在调整iframe内容时遇到了一些问题。我的网站上有2个2 * 2网格的4个iframe。

但是当我想调整内容大小以适应iframe大小时，iframe会变得更小，而且iframe之间会有很大的距离。

这是我用来调整大小的代码

.scaled-frame {

        zoom: 1.2;
        -moz-transform: scale(0.71);
        -moz-transform-origin: 0 0;
        -o-transform: scale(0.71);
        -o-transform-origin: 0 0;
        -webkit-transform: scale(0.71);
        -webkit-transform-origin: 0 0;

    }

任何想法如何解决这个或我做错了什么？

感谢

Answer 1

我是这样做的：使用百分比表示宽度。使用相关设置进行缩放，并使用-moz-transform scale。

#frame {
    width: 47%;
    zoom: 1.00;
    -moz-transform: scale(1.00);
    -moz-transform-origin: 0 0;
}

Answer 2

这是我的代码：

 .scaled-frame {
        width: 1024px;
        height: 768px;
        border: 0px;
    }

    .scaled-frame {

        zoom: 1.2;
        -moz-transform: scale(0.71);
        -moz-transform-origin: 0 0;
        -o-transform: scale(0.71);
        -o-transform-origin: 0 0;
        -webkit-transform: scale(0.71);
        -webkit-transform-origin: 0 0;

    }

这是缩放+/-功能

function Inc() {
            scale = scale + 0.05;
            $("#iframes-container > iframe").each(function () {
                //$(this).width($(this).width() + $(this).width() / 100 * 10);
                //$(this).height($(this).height() + $(this).height() / 100 * 10);
                $(this).css("zoom",parseFloat($(this).css('zoom'))+0.02);
                $(this).css("-moz-transform","scale("+scale+")");
                $(this).css("-webkit-transform","scale("+scale+")");
                $(this).css("-o-transform","scale("+scale+")");
            });
        }

        function Dec() {
            scale = scale - 0.05;
            $("#iframes-container > iframe").each(function () {
                //$(this).width($(this).width() - $(this).width() / 100 * 10);
                //$(this).height($(this).height() - $(this).height() / 100 * 10);
                $(this).css("zoom",parseFloat($(this).css('zoom'))-0.02);
                $(this).css("-moz-transform","scale("+scale+")");
                $(this).css("-webkit-transform","scale("+scale+")");
                $(this).css("-o-transform","scale("+scale+")");
            });
        }

感谢 hivegeist

缩放比例移动iframe

2 个答案: