webkit-transform的替代方案: transformY？

Question

我正在创建一个chrome扩展，它在特定页面的顶部显示一个iframe。这个iframe是固定的，放在打开的body标签之前。

为了给这个iframe预留一个位置，我使用CSS向下移动包括固定元素的正文：

-webkit-transform: translateY(40px);

它似乎在许多网站上都工作得很好，但在其他一些网站上，比如facebook，它就会带来问题。滚动条显示在右侧。

有没有其他办法可以让我尽量避免这个问题。任何帮助都将不胜感激

​

Answer 1

再往上一个节点就行了。您会猜到的，它是html元素。不幸的是，我不知道像body这样访问它的方法：document.body。

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

在这里，设置css属性。

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

除此之外，margin-top也可以工作：

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