how can i put the div element in to canvas

Question

i am trying to put the div element in to canvas.

My div element has so many images.that div element i want to put it on canvas.

How can i put the div element to canvas?

here is my code:

<canvas id="myCanvas" width="200" height="100" style="border:1px solid #000000;">

    <div class="rating-container">
        <img class="star" src="images/1.png">
        <img class="star" src="images/1.png">
        <img class="star" src="images/1.png">
        <img class="star" src="images/1.png">
        <img class="star" src="images/1.png">
    </div>
</canvas>

i tried this.. But this is not working properly..How can i fix this?

Answer 1

As far as I know, you can't. You could probably use css to place the div on top of the canvas. You can, however, put images in the canvas http://www.w3schools.com/tags/canvas_drawimage.asp

Answer 2

You can just put the images right into the canvas. Not sure if this is really what you are wanting but here is how you would do it.

var canvas = document.getElementById("myCanvas");
var context = canvas.getContext("2d");
var img = document.getElementById("myImage");
context.drawImage(img,10,10);

Hope this helps.