HTML5：如何在点击画布时停止三次鼠标点击以选择其他html元素？

Question

所以我有一个统一的WebGL游戏，并在我的画布下，我有一些链接到业务相关的网站，支持/社交等。

我们的游戏一般需要用户点击很多，现在它烦人的时候，用户在身体的任何地方三次点击，底部的这些链接图像被突出显示和选择。

它实际上并不影响游戏性，但它很烦人。

这里是页面的结构。 （出于安全删除的网址）

<img id="titleLogo" src="..." > 
<canvas class="emscripten" id="canvas" oncontextmenu="event.preventDefault()" height="639px" width="1024px"></canvas> 
<div id="loadingBox"> 
    <div id="bgBar"></div> 
    <div id="progressBar"></div> 
    <p id="loadingInfo">Loading...</p> 
</div> 
<div id="footer"> 
    <table id="links"> 
    <tr> 
     <td><a href="..." target="_blank"><img id="likeus" src="..." ></a></td> 
     <td><a href="..." target="_blank"><img id="faqhelp" src="..." ></a></td> 
    </tr> 
    <tr> 
     <td style="text-align: right;"><a href="..." target="_blank"><img id="hippo" src="..." ></a></td> 
     <td><a href="..." target="_blank"><img id="kong" src=".." ></a></td> 
    </tr> 
    </table> 
</div> 

Answer 1

您可以使用用户选择如下所述： https://developer.mozilla.org/en/docs/Web/CSS/user-select

.noSelect{ 
-moz-user-select: none; 
-webkit-user-select: none; 
-ms-user-select: none; 
} 

在CSS

和noSelect类添加到一切，当画布高达