相关疑难解决方法(0)

自动调整Google网站嵌入代码的高度(html)

我正在使用 Google 协作平台嵌入 HTML 代码,将代码粘贴到“从网络嵌入”窗口中。输出的长度是可变的。

iframe我希望有一种方法可以动态调整Google 协作平台用于托管 HTML 的父级的高度。

我知道我可以使用 Google 协作平台用户界面手动分配更多空间,不幸的是,内容会根据 API 的数据而有所不同,因此我无法事先知道高度。目前,只要内容填满分配的空间,就会出现垂直滚动条,并且看起来不太好。

我尝试了以下操作,它仅删除滚动条而不允许我看到内容:

<script>parent.document.getElementsByTagName('iframe')[0].scrolling="no";</script>
Run Code Online (Sandbox Code Playgroud)

Google 网站示例位于https://sites.google.com/view/auto-ajust-gsite-embed/home

这是我在上面的示例站点中使用的代码:

<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />

    <!-- Bootstrap CSS -->
    <link
      href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css"
      rel="stylesheet"
      integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl"
      crossorigin="anonymous"
    />

    <title>auto adjust google site embed</title>
  </head>
  <body>
    <div class="accordion accordion-flush" id="accordionFlushExample">
      <div class="accordion-item">
        <h2 class="accordion-header" id="flush-headingOne">
          <button
            class="accordion-button collapsed"
            type="button"
            data-bs-toggle="collapse"
            data-bs-target="#flush-collapseOne"
            aria-expanded="false"
            aria-controls="flush-collapseOne"
          >
            Accordion Item #1
          </button>
        </h2>
        <div …
Run Code Online (Sandbox Code Playgroud)

html javascript css google-sites-2016

9
推荐指数
1
解决办法
3152
查看次数

标签 统计

css ×1

google-sites-2016 ×1

html ×1

javascript ×1