将html div内容捕获为图像对象

Question

我的div包含来自源的图像。

<div id="main">
    <div id="sub1">
        <img src="http://i48.tinypic.com/wrltuc.jpg"
        style="width:150px; height:140px; "/></div>
    <div id="sub2">
         <img src="http://oi41.tinypic.com/24cib61.jpg"
        style="width:120px; height:100px; "/>
    </div>
    <div id="sub3">
          <img src="http://oi50.tinypic.com/1z2j8rd.jpg"
        style="width:60px; height:60px; "/>
    </div>
</div>

<div id="captureBig"></div>
<div id="captureSmall"></div>

我已经将捕获div包含在主div的捕获中。我的工作design is here

如何将我的主要div作为png或jpg图像捕获？我正在使用javascript。我会把它发布到服务器上。