Linkedin 嵌入帖子高度无需滚动动态答案

【问题标题】：Linkedin Embeded post height to be without scroll dynamicLinkedin 嵌入帖子高度无需滚动动态
【发布时间】：2022-06-29 14:44:35
【问题描述】：

在我页面上的 LinkedIn 嵌入帖子中，每个帖子都有不同的高度并且有滚动条。有什么办法可以根据帖子高度动态调整高度吗？

<iframe src="https://www.linkedin.com/embed/feed/update/urn:li:share:6917261457768280064" height="950" frameborder="0" allowfullscreen="" title="Embedded post"></iframe>

https://codepen.io/salman-aziz/pen/XWVYbga

【问题讨论】：

height: auto; 元素会自动调整其高度以使其内容正确显示
不能这样工作。检查我放代码的codepen。
当您从 Linkedin 复制 iframe 代码时，高度已包含在属性中。
@stan: 是的，我在某些帖子中尝试了以linkedin 提供的高度作为属性的帖子，但在某些类似代码笔的示例中，它仍然有滚动，我用提供的属性高度尝试了它通过linkedin
我已经通过使用叠加层的技巧解决了这个问题，并添加了一个最小高度。为了使帖子可点击，我使用了一个 jQuery 函数。它的工作。请在此处查看：codepen.io/salman-aziz/pen/XWVYbga

标签： jquery css

【解决方案1】：

谢谢。它也帮助了我

【讨论】：

【解决方案2】：

// Get url from Iframe SRC add it in Anchor HREF
    function shareIframeUrl() {
        var src = $(".linkedinWidget iframe").attr('src');
        href = src.replace('embed/', '');
        $('#iframeurl').attr('href', href);
    }
    shareIframeUrl();

*, *::before, *::after {
    box-sizing: inherit;
}
.linkedinWidget {
    position: relative;
  overflow:hidden;
}
.iframeurl {
    display: block;
    width: 100%;
    height: 1600px;
    overflow: hidden;
    cursor: pointer;
    position: absolute;
    z-index: 111;
}
.linkedinPosts {
    position: relative;
    border: 3px solid #fff;
    width: 100%;
    height: 1606px;
}
.linkedinPosts:before {
    content: '';
    background: transparent;
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    border-radius: 6px;
    border: 3px solid #fff;
    box-shadow: 0 0 0 1em #fff;
}
.linkedinPosts iframe {
    position: absolute;
    width: 100%;
    min-height: 1600px;
    top: 0;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="linkedinWidget">
<a id="iframeurl" target="_blank" class="iframeurl" href="#"></a>
<div class="linkedinPosts">
<iframe src="https://www.linkedin.com/embed/feed/update/urn:li:share:6917261457768280064" height="" frameborder="0" allowfullscreen="" title="Embedded post"></iframe></div></div>

【讨论】：