css - -webkit-transform : transformY? 的替代方案

Question

我正在创建一个在特定页面顶部显示 iframe 的 chrome 扩展程序。此 iframe 固定并放置在打开 body 标记之前。

为了为这个 iframe 预留位置，我使用 CSS 将包含固定元素的主体向下移动:

-webkit-transform: translateY(40px);

它似乎适用于许多网站，但在某些其他网站(如 facebook)上它会导致问题。右侧显示滚动条。

有没有其他方法可以避免这个问题。任何帮助将不胜感激

Answer 1

只需升高一个节点。而且，您会猜到，它是 html 元素。不幸的是，我不知道像正文一样访问它的方法:document.body。

但我找到了一个简单的方法，使用 document.body.parent。

在那里，您设置了 css 属性。

document.body.parent.style.webkitTransform = 'translateY(40px)';

此外，margin-top 也可以:

document.body.parent.style.marginTop = '40px';