如何防止IE中的iframe滚动（八）答案

【问题标题】：How to prevent iframe scrolling in IE (8)如何防止IE中的iframe滚动（八）
【发布时间】：2013-04-24 21:51:12
【问题描述】：

在寻找这个问题的答案时，我一直在寻找有关如何删除滚动条的答案。这并不能完全解决我的问题。我有一个 index.php 文件，我试图将它放入我网站上的 iframe 中。 index.php 包含一个<div>，其中包含一个<span>。

<iframe src="index.php" scrolling="no" style="border:0px; height: 300px; width:158px;"></iframe>

但是，当我单击并拖动 <div> 时，页面仍然滚动（水平）。我只能在 IE8 中看到这种情况。我已经在 Firefox 中进行了测试，但我没有看到它。如果客户在 iframe 中单击并拖动，有没有办法完全防止页面滚动？

我意识到这是一个边缘案例，它可能不会在生产中经常发生，但我的 iframe 正在公司网页上运行，我希望尽可能多地消除不良影响。

我可以在<iframe> 标记和 index.php 中添加任何我想要的内容，但 iframe 所在页面上的任何其他内容对我来说都是禁区。

Index.php 代码如下：

<div id="link"><span class="link"></span></div>

我设置了一个样式表，使用background-image 使跨度看起来像一个图像。背景图像高 60 像素，但在任何给定时间仅显示 30 像素，具体取决于跨度是否处于焦点或悬停状态。

【问题讨论】：

那个跨度是什么？我在 IE8 中做了一个小测试，iframe 内容似乎包裹在 iframe 窗口内，并且没有发生拖动滚动
实际上我现在看到了这种行为，如果 span 有很长的牢不可破的文本，就会发生这种情况。很有趣。
我什么都没有。我将它用作另一个页面的按钮/链接。跨度有一个比跨度高的背景图像，并且图像在对焦时位置会发生变化。 OnClick 它执行 Javascript 代码以打开一个新窗口。

【解决方案1】：

您需要有效地取消滚动。而且由于“onscroll”事件是不可取消的，下一个最好的事情是重置滚动位置。将此添加到您的 index.php 中（例如添加到

部分）：

<script>
        window.onscroll = function () {
            window.scrollTo(0,0)
        }
</script>

在任何滚动尝试（包括拖动滚动）时，它将重置滚动位置。您可能会注意到轻微的跳跃，但页面不会滚动。

【讨论】：

这对我来说已经足够了。我注意到轻微的跳跃，但这不是问题，因为它不是可滚动的区域。我主要担心有人试图选择图像附近的文本，并无意中将 iframe 滚动到图像部分或根本不可见的位置。