欧美一区二区三区性视频_婷婷综合另类小说色区_亚洲av乱码一区二区三区林ゆな_天堂在线资源中文在线8_久久这里只有精品首页

妙網(wǎng)科技 妙網(wǎng)科技 首頁 妙網(wǎng)科技 網(wǎng)站開發(fā) 妙網(wǎng)科技 html2canvas使用簡單實例,親測可用

html2canvas使用簡單實例,親測可用

所屬欄目: 網(wǎng)站開發(fā) | 更新時間:2017-3-25 | 閱讀:8459 次

直接上代碼,經(jīng)測試,完美正常使用,圖片清晰

<!DOCTYPE html>

<html>
  <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <style>
#aa{ width: 100px;height: 100px;position: absolute; background: #E93437;}
#bb{ width: 100px;height: 100px;position: absolute;right: 0; background: #E93437;}
#cc{ width: 100px;height: 100px;position: absolute;top: 300px;}
    </style>
  </head>
  <body>
    <div id="aa">
      測試文字
      妙網(wǎng)科技
    </div>
    <div id="bb"></div>
    <div id="cc"></div>
    <script src="http://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
    <script src="http://cdn.bootcss.com/html2canvas/0.5.0-beta4/html2canvas.js"></script>
    <script type="text/javascript">
        html2canvas(document.getElementById("aa"), {
            onrendered: function(canvas) {
var image = canvas.toDataURL("image/png");//使用PNG格式圖片很清晰
$("#bb").append(canvas);
$("#cc").html("<img src="+image+" />");
            }
        });
    </script>
  </body>
</html>

?