Safari/Chrome（Webkit） - 无法隐藏iframe垂直滚动条

感谢您的提示，提姆;它为我解决了这个问题。顺便说一下，它看起来像样式的HTML元素溢出：隐藏在一个样式标签内部不起作用 - 你需要把它作为HTML标签的样式属性（即使这是无效的）。所以...... 此：东西不是这个： <风格类型= “文/ CSS”> HTML {溢出：隐藏; } 东西 – Rudi 2010-08-18 18:03:01

在镀铬/ 10.0.648.133似乎工作的溢出是：隐藏在''标签，为内嵌样式，甚至在外部样式表 - 虽然镀铬似乎是对于缓存外部样式表有点太积极。也许这个错误在过去几年中有所修正。 – 2011-04-09 17:06:12

+10

HTML内联样式？我现在已经看到了一切...... – 2011-05-05 20:37:18

检查滚动是否来自iframe，也许它来自HTML或BODY。

对于滚动iframe中

<iframe scrolling="no">

在CSS

iframe { overflow:hidden; } 

or 

iframe { overflow-x:hidden; overflow-y:hidden}

来源

2009-12-21 13:21:07 Razielblood

不使用时，所有的IFRAME滚动标签，并添加样式风格=“溢出-X：隐藏;溢出-Y：汽车;” 这将删除水平滚动，它也应该反过来。

-Jai

来源

2009-12-21 14:06:13 Jai

这有帮助吗？在Chrome浏览器，IE浏览器，FF ...

<style type="text/css"> 
html { overflow:hidden; } 
#test { position:absolute; top:50; left:50; right:50; bottom:50; height:2000px; } 
</style> 

<body scroll="no"> 
<div id="test">content</div> 
</body>

来源

2010-01-15 13:14:41 tpeck

我刚解决它在我的博客上滚动=“no”后的样式标记。

如：

iframe src="asdf.html" style="overflow: hidden;" scrolling="no"

我留下的样式属性在那里，因为它更合适，它在Firefox的罚款。

来源

2010-07-12 21:46:58

设置iframe的滚动属性设置为“无” 应该解决这个问题，但似乎在WebKit的一个错误：https://bugs.webkit.org/show_bug.cgi?id=29240

Tim的变通（Safari/Chrome (Webkit) - Cannot hide iframe vertical scrollbar）似乎解决问题 - 为只要您有能力编辑iframe中包含的文件...

来源

2010-08-18 18:17:41 Rudi

隐藏的iframe中铬把body标签滚动这样

<body style="margin:0px; padding:0px; overflow:hidden;"></body>

来源

2010-10-08 11:33:50 Vaidehi

为了摆脱灰色的滚动条，把“溢出：隐藏;”在Iframe中显示的页面的主体标签上，例如<body style="overflow:hidden;">在Chrome 8.0.552.215中，我工作得很好，而且我在Iframe本身也有“溢出：隐藏”

来源

2010-12-10 16:15:08

在Ubuntu 10.10下使用Chrome 8.0.552.224测试版，仍然显示此网站上的幽灵滚动条：http://www.w3schools.com/TAGS/tryit.asp?filename=tryhtml_iframe_scrolling。我尝试了所有的技巧，适用于所有浏览器，但不适用于基于WebKit的浏览器。因此这个错误似乎并没有完全解决。

来源

2010-12-26 09:51:00 harald

Note: this is useful if you cannot edit the CSS/HTML of the iFramed content.

这是一个黑客攻击的一位，但我通过包裹在<div>的解决了这个问题，设置<div>的高度，宽度& overflow:hidden，然后设置的宽度&高度实际溢出包装<div>。

<style> 
    div {height:100px;width:100px;overflow:hidden} 
    iframe {height:150px;width:150px;overflow:hidden} 
</style> 

<div> 
    <iframe src="foo.html" scrolling="no"></iframe> 
</div>

希望这会有所帮助。

来源

2011-03-25 14:01:01 Labu

这是一个强力的办法，应该作为一种解决方法工作，缺少功能或错误:) – 2011-04-09 17:07:25

只需添加溢出：隐藏的iframe的风格足以让滚动设置在Safari，Chrome和IE – nuander 2014-10-24 16:24:19

可以隐藏滚动条和保持滚动功能（通过触摸板或使用滚轮，或在手机或平板电脑触摸和拖拽：

<style> 
    iframe::-webkit-scrollbar { 
    display: none; 
    } 
</style>

很明显，你可以改变iframe来什么适合你的设计，你可以添加相当于-mozilla-属性来获取它在Firefox正常工作。

来源

2011-06-16 16:44:13 palako

真棒工作对我来说，这应该是被接受的答案。 – 2012-02-08 23:20:30

这就是答案。 http://www.webkit.org/blog/363/styling-scrollbars/ – iGbanam 2012-06-09 03:13:25

有没有一个主持人可以使这个正确的答案？ – 2012-12-05 15:26:01

document.body.addEventListener('touchmove', function(e){ e.preventDefault(); });

这个工程，没有其他人似乎工作包括e.preventDefault()为touchstart。

来源

2012-12-14 08:54:30 foopanda

<iframe> <body style="overflow-x: hidden"> </body> </iframe>

来源

2014-07-02 16:31:23

1.当您更改iframe的滚动yes或no时，iframe的滚动条不会立即显示，您必须刷新iframe。在IFRAME

2. HTML自来水溢出colud影响iframe的滚动条

3.in的IE浏览器，你必须清除IFRAME的src，然后刷新iframe中，这将是工作

4.so，秀你的代码

HTML

<iframe id="main_ifrm" class="main" frameborder="0" scrolling="no" src="new.html" ></iframe> 
<button id="btn1">scrolling yes</button>

的JavaScript

var ifrm = document.getElementById("main_ifrm"); 
var btn1 = document.getElementById("btn1"); 
btn1.onclick = function(){ 
    $(ifrm).prop("scrolling","no"); 
    $(ifrm.contentWindow.document).find("html").css("overflow","hidden") 
    var src = $(ifrm).prop("src"); 
    $(ifrm).prop("src",""); 
    $(ifrm).prop("src",src); 
}

来源

2017-03-10 06:08:49 kuminson

Safari/Chrome（Webkit） - 无法隐藏iframe垂直滚动条

回答

相关问题