删除 iFrame 上的垂直滚动

Question

从该示例页面的可用职业列表 iframe 中删除垂直滚动时遇到一些问题。

如果我将 height="1600px" 增加到 height="1700px"，则垂直滚动在桌面上消失，但仍保留在移动设备上。

    <div class="jobs__wrap bg-grey-pattern">
    <div class="jobs__header">
    <h4>Available Careers</h4>
    </div>
    <iframe src="https://demorecruiting.paylocity.com/recruiting/jobs/All/85e4f102-5f4c-4548- 
    b6ca-cc391c862dc5/CPUMMILL" width="100%" height="1600px" style="border:0;" 
    allowfullscreen="no" loading="lazy"></iframe>
    </div>

棘手的是，目前有 16 个空缺职位。该数字会波动，iframe 部分可能会显示少至 2 或 3 个或多至 20 个左右的可用职位...因此 iframe 职位列表部分的高度会降低和增加。

Answer 1

 <div class="jobs__wrap bg-grey-pattern">
    <div class="jobs__header">
    <h4>Available Careers</h4>
    </div>
    <iframe onload="resizeIframe(this)" id="iframe-id" src="https://demorecruiting.paylocity.com/recruiting/jobs/All/85e4f102-5f4c-4548- 
    b6ca-cc391c862dc5/CPUMMILL" width="100%" height="100%" style="border:0;" 
    allowfullscreen="no" loading="lazy"></iframe>
    </div>
<script>

  function resizeIframe(iframe) {
    iframe.height = iframe.contentWindow.document.body.scrollHeight + "px";
  }

</script>

删除 iFrame 上的垂直滚动

Remove Vertical Scroll on iFrame

html

css

iframe