手机中的聚合物纸制造方形面罩

Question

我的索引页面上有一个纸厂，它一直显示，直到我点击它。我说点击是因为这种行为只发生在移动环境中（在 chrome 移动视图中或在我的 Nexus 5 上）。

这是活动按钮（点击时）：

请注意，背景为浅灰色。按钮周围的这个方块是我要删除的。按钮是完美的圆形。但是这个东西在点击时会出现。

我测试了其他应用程序，例如 Topeka，并且活动按钮（点击时）显示正确：

但显然我的纸厂和托皮卡的纸厂之间并没有什么特别之处。

这是元素声明和 CSS：

<paper-fab icon="add" id="add-button"></paper-fab>

paper-fab#add-button {
  position: relative;
  background-color: #3F51B5;
  display: block;
  margin-bottom: 15px;
}

有什么问题吗？

提前致谢。

Answer 1

你的灵丹妙药是：

body {
  -webkit-tap-highlight-color: rgba(0,0,0,0);
}

我还建议您为您的style 声明指定shim-shadowdom 参数：

<style shim-shadowdom>

顺便说一句，您可能想将您的代码与官方的paper-fab docs 进行比较，而不是 topeka。

希望对你有帮助。