如何防止 IE 11 上 iframe 中的图像滚动？答案

【问题标题】：How to prevent image in iframe scrolling on IE 11?如何防止 IE 11 上 iframe 中的图像滚动？
【发布时间】：2019-09-29 03:18:51
【问题描述】：

我的测试站点在这里：http://acjs.4fan.cz/test/index.html

它包含 4 张相同的 140 x 140 像素的图像。 img 标签用于顶行，140 x 140 像素的 iframe 标签用于底行。我不会问为什么不同浏览器的 iframe 图像显示不同:-)

我想知道如何防止 iframe 中的图像在 IE 11 上滚动，如以下视频所示：https://www.youtube.com/watch?v=jS6FiY8dpUA?

【问题讨论】：

标签： html internet-explorer iframe

【解决方案1】：

我认为最好的方法是使用 CSS 将内容设置为 100% 的内部以及 HTML 中 iframe 所需的内容

#content{
 width:100%;
height:100%; 
}

【讨论】：

【解决方案2】：

您可以让图像完全填满 iframe，以防止它在 IE11 上滚动。获取 iframe <body> 并将 body 的样式设置为 margin:0px;padding:0px 以使其完全填充。以下是相关代码：

    <script>
            function a() {
                var iframe = document.getElementById('iframe1');
                var b = iframe.contentWindow.document.body;
                b.style.cssText = "margin:0px;padding:0px"; 
            }
    </script>

    <body onload="a()">
        <iframe width="140" height="140" src="image.jpg" frameborder="1" scrolling="no" id="iframe1">
        </iframe>
        <iframe width="140" height="140" src="c1.html" frameborder="1" scrolling="no" id="iframe2">
        </iframe>
    </body>

【讨论】：

谢谢周宇——它成功了。但是，现在我想将图像加载为 src="c1.html"，并且 c1.html 包含该加载的图像 - 如下所示：acjs.4fan.cz/test-2/index-2.html。你能摆脱 IE 11 上的垂直滚动吗？
我在上面编辑了我的答案。你应该给 src="c1.html" 的 iframe 一个 id="iframe2"，而不是 id="iframe1"。
感谢周宇的新版本。虽然它适用于 src="image.jpg" 很好，但由于某种原因它仍然不适用于 src="c1.html"，请参阅此视频：youtu.be/GdWi62MyVH0。知道如何在 IE 11 上修复它吗？
把ondragstart="return false;" 放到c1.html的<body>中。它禁用 iframe 中的滚动。