当缩放iframe时，Chrome会忽略CSS

Question

运行时的代码在Firefox中工作正常，但在Chrome中 - 它根本不起作用 - 来自iframe的#agree元素无法隐藏。如何修复Chrome？

这是我的简化代码：

<iframe src="blank.htm"></iframe>

<button id="btn">Toggle</button>

<script>
frame = null;

$('iframe').load(function()
{
    frame = $('iframe').contents();
});

$('#btn').click(function()
{
    var div = frame.find('#agree');
    div.toggle();
});
</script>

<style>
iframe
{
    width: 600px;
    height: 1200px;
    transform: scale(0.5);
}
</style>

在这里你可以测试它： http://nitton.pl/chrome/

Answer 1

chrome和firefox之间的区别在于 chrome使用-webkit-transform:浏览器引擎而firefox没有。

尝试使用webkit使其在Chrome浏览器上以最佳方式运行。