javascript - 相对于整个屏幕在 iframe 内保持固定位置

Question

上下文:

• 我们通过客户网站内的 iframe 为我们的应用提供服务
• iframe 是无缝的，滚动现在只发生在父 div 中。
• 我们应用程序中的一个 Div 有一个固定的位置，并且应该始终存在，无论您滚动多少次。
• 更新:我们在 iframe 旁边部署了一个 javacript 脚本，因此我们可以访问托管页面

问题:当在 iframe 内提供服务时，固定位置 Div 似乎并没有保持其相对于整个网页的固定位置。意思是，当有人滚动时，固定的 div 不再真正保持固定。

有什么解决方法吗？

Answer 1

除了从外部框架动态设置 onScroll 的位置，我没有看到其他解决方案，如下所示:

    $(() => {
      $('#contentframe').ready(() => {
        const topElem = $("#top", frames['contentframe'].document);
        const topElemTopPos = topElem.offset().top;
        $(window).on('scroll', () => {
          const scrollFromTop = $(document).scrollTop();
          topElem.css({ top: (scrollFromTop + topElemTopPos) + "px" });
        });    
      });
    });

https://codepen.io/jobe451/pen/OJWJGQX