js+html5繪制圖片到canvas的方法
更新時(shí)間：2015年06月05日 11:58:37 作者：pythoner
這篇文章主要介紹了js+html5繪制圖片到canvas的方法,涉及html5元素操作的相關(guān)技巧,需要的朋友可以參考下
本文實(shí)例講述了js+html5繪制圖片到canvas的方法。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下：
<!DOCTYPE html>
<html>
<body>
<canvas id="myCanvas" width="200" height="100"
style="border:1px solid #c3c3c3;">
Your browser does not support the HTML5 canvas tag.
</canvas>
<script type="text/javascript">
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var img=new Image();
img.onload = function(){
ctx.drawImage(img,0,0);
};
img.src="img_flwr.png";
</script>
</body>
</html>
更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《JavaScript動(dòng)畫特效與技巧匯總》《JavaScript運(yùn)動(dòng)效果與技巧匯總》及《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》
希望本文所述對(duì)大家的web程序設(shè)計(jì)有所幫助。
相關(guān)文章
這篇文章主要為大家分享一下18個(gè)在項(xiàng)目中使用很高頻的JS工具方法，希望大家能夠知其然也知其所以然，不要只會(huì)調(diào)用?api，也要會(huì)寫?api，快跟隨小編一起學(xué)習(xí)一下吧2022-04-04
JavaScript中的undefined學(xué)習(xí)總結(jié)
這篇文章主要是對(duì)JavaScript中的undefined進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2013-11-11
javascript自動(dòng)改變文字大小和顏色的效果的小例子
這篇文章介紹了javascript自動(dòng)改變文字大小和顏色的效果的小例子，有需要的朋友可以參考一下2013-08-08
JS數(shù)據(jù)類型STRING使用實(shí)例解析
這篇文章主要介紹了JS數(shù)據(jù)類型STRING使用實(shí)例解析,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-12-12
平時(shí)在開(kāi)發(fā)小程序的時(shí)候，彈窗應(yīng)用場(chǎng)景還是蠻廣泛的，但是微信官方提供的彈窗比較有局限性，不能自定義修改。下面通過(guò)本文給大家?guī)?lái)了微信小程序自定義彈窗wcPop插件，感興趣的朋友跟隨小編一起看看吧2018-11-11
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)隨機(jī)點(diǎn)名，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-01-01
JS實(shí)現(xiàn)旋轉(zhuǎn)木馬式圖片輪播效果
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)旋轉(zhuǎn)木馬式圖片輪播效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-01-01
javascript中通過(guò)arguments參數(shù)偽裝方法重載
面向?qū)ο蟮母呒?jí)語(yǔ)言中，都有方法的重載，在js中可以通過(guò)arguments這個(gè)參數(shù)來(lái)偽裝成函數(shù)重載，具體如下2014-10-10
Nuxt.js實(shí)現(xiàn)校驗(yàn)訪問(wèn)瀏覽器類型的中間件
Nuxt.js 就是一個(gè)Vue的服務(wù)端渲染框架,和React的服務(wù)端渲染框架類似。這篇文章主要介紹了Nuxt.js實(shí)現(xiàn)校驗(yàn)訪問(wèn)瀏覽器類型的中間件,需要的朋友可以參考下2018-08-08
使用js在layui中實(shí)現(xiàn)上傳圖片壓縮
這篇文章主要介紹了使用js在layui中實(shí)現(xiàn)上傳圖片壓縮，layui 是一款采用自身模塊規(guī)范編寫的前端 UI 框架,js上傳圖片壓縮百度有很多方法，,需要的朋友可以參考下2019-06-06