如何在iframe中隐藏滚动条，但仍然可以滚动 [英] How to hide scrollbar in iframe, but still be able to scroll

问题描述

我在一个页面上有一个iframe，其中有另一个页面.我想隐藏滚动条，但是我找不到任何解决方案. 我已经尝试过overflow: hidden;，但是它不起作用.

I have an iframe on a page with another page inside it. I want to hide the scrollbar but i can't find any solution for this. I have tried with overflow: hidden; but it's not working.

请参见以下代码:

    <iframe frameborder="0" src="https://google.com/"></iframe>

CSS代码:

   iframe{
      overflow: hidden;
    }     

推荐答案

由于您没有指定垂直或水平溢出的解决方案，因此我假设您正在谈论垂直溢出.

Since you didn't specify if you need a solution for the vertical or horizontal overflow, I am assuming you are talking about the vertical one.

这可以在父div的帮助下完成.

This can be done with the help of the parent div.

1.将父div的溢出设置为隐藏. 2.将子div的溢出设置为auto，并将其宽度设置为200％(或任何大于100％或大于父对象的宽度-以便隐藏滚动条).

1.Set the overflow of the parent div as hidden. 2. Set the overflow of the child div to auto and the width 200% (or anything more than 100%, or more than the width of the parent - so that the scrollbar gets hidden).

.container {
  width: 300px;
  overflow: hidden;
}

.child {
  width: 200%;
  height: 200px;
  overflow: auto;
}

jsfiddle

这篇关于如何在iframe中隐藏滚动条，但仍然可以滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！