Question

有没有办法阻止Google翻译栏移动我的内容？我有一个静态背景图片，以及与背景图片对应的标题图片，因此当Google翻译栏固定在屏幕顶部时，它会将我的顶级内容向下移动并移出背景图像。

有没有办法让它只是静态地覆盖我的内容，或以某种方式修复它不会移动我的内容？

或者我可以检测到翻译是否正在进行，然后相应地移动我的背景？我尝试使用此功能但如果我删除翻译栏则不会还原：

document.addEventListener('DOMSubtreeModified', function (e) {
if(e.target.tagName === 'HTML' && window.google) {
        if(e.target.className.match('translated')) {
            document.body.style.backgroundPosition="0px 40px";
        } else {
            document.body.style.backgroundPosition="0px 0px";
        }
    }
}, true);

Answer 1

没有代码示例会有点困难，但最简单的解决方案是在翻译栏上设置position: fixed;和top: 0，但这意味着它将始终保留在页面顶部一旦你向下滚动。

如果翻译栏位于文档顶部附近（听起来像是这样），您可以将位置设置为absolute，而保留top: 0声明。这应该使它出现在最近的定位祖先的顶部，即位置设置为relative，absolute，fixed或{{1 }}。如果这不存在，它将根据根标记定位，即sticky在格式良好的文档中。例如，您可以在<html>上设置position: relative。

<body>和fixed都将元素完全从文档流中取出，因此它们将完全按照您在此处请求的内容执行：显示在其他内容之上。

谷歌翻译栏移动内容

1 个答案: