向canvas添加元素html5

Question

可以在HTML5的canvas中添加元素吗？

例如：

<canvas id="canvas2" width="650" height="850"> 
    <div class="draggable" class="ui-widget-content" width='100px' height='100px'> 
     <textarea class="resizable" rows="2" cols="10" style="color: #FF0707; "> 
     Example 
     </textarea> 
    </div> 
</canvas> 

，这并不表明什么......但是，如果我把可拖动DIV在它的工作原理HTML的任何其他元素里面......

我是什么失踪？

Thx。

Answer 1

不能添加元素融入这样的画布。 当浏览器不支持时显示画布的innerHTML<canvas>。 您应该在画布旁边的额外元素或画布上方的<div>图层。

<canvas id="canvas2" width="650" height="850"> 

</canvas> 
<div style="position: absolute; top: 50px; left: 50px; width: 100px; height: 100px; z-index: 5;" class="draggable" class="ui-widget-content"> 
    <textarea class="resizable" rows="2" cols="10" style="color: #FF0707; "> 
     Example 
    </textarea> 
</div> 

参见： https://developer.mozilla.org/en/Canvas_tutorial/Basic_usage#Fallback_content

Answer 2

画布元素是被替换的元素。他们呈现一个位图。他们的内容，如 s和<object> s的内容适用于元素不受支持的情况。

你正在做的是类似于在图像中放置元素。

canvas元素的内容（如果有的话）是元素的后备内容。

- http://www.w3.org/TR/html5/the-canvas-element.html#the-canvas-element