问题

Question

我正在处理Chrome扩展程序，该扩展程序会在用户正在处理的任何标签上显示叠加层。我需要它在完整视口内操作。

我使用vanilla javascript和内容脚本来注入一个完整的视口大小div（到身体，因为我希望它可以在任何网站上使用），然后将我的模板附加到我创建的div并使用Angular注入它们。它运作得很好。

问题

然而，这个叠加有点阻塞，因为我创建的div必须具有至少为0的z索引。让我们假设您执行谷歌搜索，您将能够搜索，因为谷歌搜索栏有z-index＆gt; 0，但您无法点击结果......问题几乎出现在任何网站上。

现在我尝试使用z-index：我应用z-index = -1所以我不会看到主叠加div但问题是我附加到它的内容似乎继承了z-index -1无论如何我都看不到我的模板！

我已经在这里看了很多话题，但我没有找到问题的答案！

问题终于......！

如何创建非阻挡镀铬覆盖？：）

请记住：我需要能够在任何特定时刻与叠加层互动，而不仅仅是当我点击与BrowserAction相关的图标时！

Answer 1

诀窍就是添加css属性

public string From_To(string text, string from, string to)
{
    if (text == null)
        return null;
    string pattern = @"" + from + ".*?" + to;
    Regex rx = new Regex(pattern, RegexOptions.Compiled | RegexOptions.IgnoreCase);
    MatchCollection matches = rx.Matches(text);
    return matches.Count <= 0 ? text : matches.Cast<Match>().Where(match => !string.IsNullOrEmpty(match.Value)).Aggregate(text, (current, match) => current.Replace(match.Value, ""));
}

到主div和

  pointer-events: none;

到模板

覆盖Chrome扩展角度

问题

问题终于......！

1 个答案: