在iframe中隱藏滾動條，並用頁面上的滾動條替換

Question

我有垂直滾動條的iframe。 我需要刪除它，並在頁面上保留此scollbar。 因此，當我需要滾動iframe的內容時，可以使用頁面滾動條。 我確實從iframe中隱藏了垂直滾動條，但是現在，我根本沒有它。 我用：

iframe::-webkit-scrollbar {  
    display: none;
  }  

而且這僅適用於Google Chrome，但不適用於Firefox和Internet Explorer。 我嘗試了以下所有方法：

iframe::-moz-scrollbar {display:none;}
iframe::-o-scrollbar {display:none;}
iframe::-google-ms-scrollbar {display:none;}
iframe::-khtml-scrollbar {display:none;}

但是他們沒有用。

因此，我需要您的幫助才能使用所有瀏覽器在iframe中隱藏滾動條。 並能夠從頁面的滾動條滾動iframe的內容。 謝謝

Answer 1

根據IE的版本，有時使用iframe {overflow: hidden;}將隱藏滾動條。 但通常在所有瀏覽器中都可以在iframe中使用scrolling="no" 。

Answer 2

您可以將JavaScript添加到IFRAME中的頁面，以在加載和調整大小時設置IFRAME在父級中的高度。 該頁面將需要與父頁面位於同一域中，盡管您可以通過瀏覽器安全設置來克服此問題。

在頁面內（示例使用jQuery）：

if (window != window.parent)
    $(function() {
        var resize = function() { $(window.parent.document).find("IFRAME[name='" + window.name + "']").height($(document).height()); };
        $(window.parent).resize(resize);
        resize();
    });

您需要在父頁面上為iframe命名：

<iframe name="anything" ...></iframe>

Answer 3

這似乎很好用：

HTML 5 / CSS

 .ifm { width: 1200px; height:800px; overflow-y: hidden; } 

 <iframe src="https://bing.com" class="ifm" scrolling="no" seamless="seamless"> </iframe> 

根據這篇文章。