如何在谷歌浏览器上删除 iframe 的水平滚动条

Question

我想要启用垂直滚动和关闭水平滚动。

使用 scrolling="no" 不是我想要的，因为我仍然想要垂直滚动。

我已经尝试将它添加到 css 中

  #myiframe{
    overflow-x:hidden;
    overflow-y:auto;
  }

但它仍然只显示 chrome 的水平滚动条。其他浏览器都很好。

感谢任何帮助

Answer 1

如果您可以访问 iframe 源页面，则可以放置

body {
    overflow-x:hidden;
}

该页面的内部。如果你不这样做，但至少页面来自同一个域，我相信来自父页面的类似这样的东西应该可以工作：

#myiframe body {
    overflow-x:hidden;
}

如果以上都不是真的 - 您可以通过实际隐藏 iframe 容器内的水平滚动条来模拟“溢出-x：隐藏”。将 iframe 放入高度较低的容器 DIV 中，例如：

<div id="myiframecontainer">
    <iframe id="myiframe" src="http://en.wikipedia.org"  />
</div>

#myiframecontainer {
    width:600px;
    height:400px;
    overflow:hidden; 
}

#myiframe {
    width:100%;
    height:420px; 
}

由于 iframe 的高度大于 div 的高度并且 div 的溢出设置为隐藏 - iframe 的水平滚动条将被隐藏。垂直仍然可以运行。

演示：http://jsfiddle.net/5DPgf/