Question

这是我的Html：

<iframe onload="reloadOnce(this)" frameborder="no" src="cloud.php" class="foo1" scrolling="no" seamless="seamless" allowTransparency="true" width="100%" height="90em"></iframe>

这是我的CSS

.foo1{margin: 0; padding: 0; width:100%; height:90em; overflow-x: scroll; }

据我所知，overflow-x：scroll;没有必要，即使我删除它，但它仍然是相同的。我用它来进行视差网页滚动。为了您的信息，我尝试使用z-index：function，但没有实现！

实际上，鼠标滚动在其他网络区域中有效，但在iFrame特定区域则无效。

先谢谢。

Answer 1

你可以在它上面放置一个透明的div。我把它涂成绿色，这样你就可以看到它。如果删除.iframeHat，iframe可以滚动。

希望这对您有用，只要您在iframe中没有任何您希望用户与之互动的内容。

HTML：

<div id="content1"></div>
<iframe id="iframe" src="http://fender.com"></iframe>
<div class="iframeHat"></div>
<div id="content2"></div>

CSS：

#iframe, .iframeHat {
width:300px;
height:300px;
margin-left:50px;
border:none;
}
.iframeHat {
margin-top:-304px;
background-color:rgba(10,100,0,0.5);
position:relative;
z-index:999;
}

http://jsfiddle.net/u940x50x/

当光标在iFrame上时，鼠标滚轮不工作

1 个答案: