Chrome拡張機能 - 基本ページのiframeからのコンテンツをオーバーレイする

Question

クロム拡張機能を使用して、ページの右側にメニューを表示します（それぞれ47ピクセル幅のボタンがいくつかあります）。このため、iframeの幅も47ピクセルに設定されています。

しかし、ボタンをクリックすると、47pxよりも広いドロップダウン（または「小滴」）を表示したいと思います。現在のところ、このコンテンツはiframeの端で切り取られています。

これをすべてiframeから制御できるようにしたいので、何かを変更したいときはいつも拡張機能を更新する必要はありません。下のウェブサイトのiframeからコンテンツをオーバーレイする方法はありますか？

EDIT

私は解決策になるのiframeのサイズを変更するとは思いません。追加の情報を含むdivは、例えば次のようになります。 400x200ピクセルです。 iframeのサイズを増やすと、下にあるウェブサイトを表示するが、クリック可能ではない透明部分があります。理想的には、iframeからのコンテンツは、既存のiframeサイズからオーバーレイするだけです。 IFRAMEをロードcontent.jsに

機能：

function showMenu(element) { 

    var iframe = document.createElement('iframe'); 

    iframe.src = chrome.runtime.getURL('menu.html); 
    iframe.style.cssText = "\ 
          position:absolute;\ 
          visibility:visible;\ 
          top:33%;\ 
          right:0px;\ 
          width:47px;\ 
          height:198px;\ 
          margin:0;\ 
          padding:0;\ 
          border:none;\ 
          overflow:hidden;\ 
          background:transparent;\ 
          z-index:999999;\ 
         "; 

    element.append(iframe);  
} 

menu.html

<style> 
html, body, iframe, h2 { 
    margin: 0; 
    padding: 0; 
    border:none; 
    display: block; 
    width: 100vw; 
    height: 100vh; 
    background: transparent; 
    color: black; 
} 
h2 { 
    height: 50px; 
    font-size: 20px; 
} 
iframe { 
    height: calc(100vh - 50px); 
} 
</style> 

<iframe class="menu"></iframe> 

Answer 1

その境界（see this post）をオーバーフローするIFRAMEのための方法はありません。

したがって、おそらく拡張機能を使ってメッセージを渡すことで、より多くのコンテンツを表示したい場合は、iframeのサイズを大きくする必要があります。または、iframeを使用せず、何かを変更したときに拡張機能の更新をリリースしなくて済むようにします。