JS 截取图片(img)标签中一块区域的内容转为base64编码

JavaScript05

JS 截取图片(img)标签中一块区域的内容转为base64编码,第1张

/**

* Convert an image

* to a base64 string

* @param {String} url

* @param {Function} callback

* @param {String} [outputFormat=image/png]

*/

function convertImgToBase64(url, callback, outputFormat){

var canvas = document.createElement('CANVAS'),

ctx = canvas.getContext('2d'),

img = new Image

img.crossOrigin = 'Anonymous'

img.onload = function(){

var dataURL

canvas.height = img.height

canvas.width = img.width

ctx.drawImage(img, 0, 0)

dataURL = canvas.toDataURL(outputFormat)

callback.call(this, dataURL)

canvas = null

}

img.src = url

}

这个方法试试吧！！！！

wrap为外部的框,心形为内部的结构,你切图的时候要把内部的框空出来,这样放图片的时候才能嵌进去

下边给你写一些代码

<div class="wrap">

     <div class="heart">

         <ul>

             <li><img src=""/></li>

             <li><img src=""/></li>

             <li><img src=""/></li>

          </ul>

     </div>

</div>