如何使iframe 100％无滚动条

Question

我想表示移动版本的网站。我使用了不带滚动的iframe，并使用自定义滚动条创建了div。它几乎可以工作，除了每个背景图像都放大。只要看一下小提琴的例子，你会明白我的意思。我认为这是因为我将高度固定为6000，但我无法弄清楚如何使iframe的高度为100％，而不需要iframe的滚动条。有人可以帮助使iframe 100％没有滚动条，但固定宽度和自定义的div滚动条，就像这个小提琴的例子。 http://jsfiddle.net/KMzgm/3387/

.scroll { 
    width: 500px; 
    height: 500px; 

    overflow: scroll; 
} 
.scroll::-webkit-scrollbar { 
    width: 12px; 
} 


.scroll::-webkit-scrollbar-thumb { 
    border-radius: 10px; 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
} 

    <div class="scroll"> 

<iframe src="http://spruce.yourwebsite.directincorporation.com/home/" height="6000" width="400" 
scrolling="no" frameborder="0"></iframe> 

</div> 

Answer 1

尝试设置溢出-Y隐藏。

iframe { 
    width:500px; 
    height: 500px; 
    overflow-y: hidden; 
} 

Answer 2

在这里你去。 阅读关于 vh and vw units.！

http://jsfiddle.net/KMzgm/3389/

.scroll { 
    width: 500px; 
    height: 100vh;}