iframe-height

iframe-height

Description

iframe-height 是一個 web component，用來自動調整 iframe 高度

Installation

if use yarn

yarn add iframe-height

script tag

<script
  type="module"
  src="https://www.unpkg.com/iframe-height@1.0.2/dist/bundle.js"
></script>

Usage

Web component Web 組件通常使用 HTML、CSS 和 JavaScript 的組合來創建，並且可以在任何 Web 頁面或 Web 應用程序中使用，而不受使用的框架或庫的影響

<iframe-height src="https://www.google.com" id="iframe"></iframe-height>

注意事項

你所嵌入的 iframe 記得 post message ，該 web component 才能正常運作

window.addEventListener('load', () => {
  const message = {
    height: document.body.scrollHeight,
    width: document.body.scrollWidth,
  };
     // window.top refers to parent window
    window.top.postMessage(message, '*');
  });