快速单击div时删除蓝色框答案

【问题标题】：Remove blue box when rapidly clicking div快速单击div时删除蓝色框
【发布时间】：2017-07-02 04:09:03
【问题描述】：

这里有很多关于在点击 <a/> 标签、links 和 buttons - Remove blue border from css custom-styled button in Chrome 时消除蓝色轮廓/边框的问题，例如 - 但我想知道的是那里一种防止在<div> elememt 上快速单击时有时会出现烦人的蓝色框的方法？

<div class="img" style="left: -200%;"></div>
<div class="img" style="left: -100%;"></div>
<div class="img visible" style="left: 0%;"></div>
<div class="img" style="left: 100%;"></div>
<div class="img" style="left: 200%;"></div>

我有 5 个 div，就像上面的一样。当单击具有 visible 类的 div 时，该类被删除并添加到列表中的下一个 div 并调整左侧值等等。当您快速单击时，您有时会看到这个看起来很烦人的蓝色框将自身附加到可见 div 或它的左侧或右侧。

快速点击就像选择 div 一样吗？

我不确定这个框会叫什么，如果可以的话，你可以使用 css 定位它并禁用它吗？

【问题讨论】：

标签： html css

【解决方案1】：

如果我没看错，我认为你只是在突出显示一个框，就像双击文本但带有一个 div。 https://css-tricks.com/overriding-the-default-text-selection-color-with-css/相关链接。

【讨论】：

【解决方案2】：

好的，所以再多挖掘一下并找到答案

.elementToBeTargeted {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

这将删除当您多次单击同一元素时有时会出现的蓝色突出显示/选择框。

【讨论】：