javascript - 总是在总是写东西的 Canvas 上制作一个 div

Question

我不断地使用 kinetic.js 在我的 Canvas 上绘制一些线条，我希望在 Canvas 上显示一个 div 文本。使用 relative 和 absolute 技巧我可以在我的 Canvas 中间放置一个 div 但问题是因为我不断画线，这些线被画在我的顶部我不想发生的 div 文本!

基本模板:

    <div id="div-text" style="background-color:#00baba; position: absolute; margin-top: 50%; margin-left: 50%;">
        greatTexts
   </div>

   <div id="container" style="position: relative; width: 100%; height: 100%;">
   <canvas></canvas> 
   </div>

Answer 1

我相信您也可以在 #container 和 #div-text 上设置一个 z-index 值。像这样:

<div id="div-text" style="background-color:#00baba; position: absolute; margin-top: 50%; margin-left: 50%;z-index:999;">
        greatTexts
   </div>

  <div id="container" style="position: relative; width: 100%; height: 100%;z-index:990;">
     <canvas id="myCanvas" height="500" width="500"></canvas> 
   </div>

This显示一个例子。