js+HTML5實(shí)現(xiàn)canvas多種顏色漸變效果的方法
更新時(shí)間：2015年06月05日 12:12:58 作者：pythoner
這篇文章主要介紹了js+HTML5實(shí)現(xiàn)canvas多種顏色漸變效果的方法,涉及html5屬性的相關(guān)技巧,需要的朋友可以參考下
本文實(shí)例講述了js+HTML5實(shí)現(xiàn)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 grd=ctx.createLinearGradient(0,0,175,50);
grd.addColorStop(0,"#FF0000");
grd.addColorStop(1,"#00FF00");
ctx.fillStyle=grd;
ctx.fillRect(0,0,175,50);
</script>
</body>
</html>
希望本文所述對(duì)大家的web程序設(shè)計(jì)有所幫助。
相關(guān)文章
簡(jiǎn)單的網(wǎng)頁(yè)廣告特效實(shí)例
下面小編就為大家?guī)?lái)一篇簡(jiǎn)單的網(wǎng)頁(yè)廣告特效實(shí)例。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-08-08
IE中直接運(yùn)行顯示當(dāng)前網(wǎng)頁(yè)中的圖片 推薦
IE中直接運(yùn)行顯示當(dāng)前網(wǎng)頁(yè)中的圖片 推薦...2006-08-08
JS排序算法之希爾排序與快速排序?qū)崿F(xiàn)方法
這篇文章主要介紹了JS排序算法之希爾排序與快速排序?qū)崿F(xiàn)方法,結(jié)合實(shí)例形式分析了希爾排序與快速排序的原理及javascript實(shí)現(xiàn)技巧,需要的朋友可以參考下2017-12-12
javascript遍歷對(duì)象的五種方式實(shí)例代碼
在我們?nèi)粘９ぷ鬟^(guò)程中,我們對(duì)于javaScript遍歷對(duì)象、數(shù)組的操作是十分的頻繁的,這篇文章主要給大家介紹了關(guān)于javascript遍歷對(duì)象的五種方式,需要的朋友可以參考下2021-10-10
javascript中巧用“閉包”實(shí)現(xiàn)程序的暫停執(zhí)行功能
javascript中巧用“閉包”實(shí)現(xiàn)程序的暫停執(zhí)行功能...2007-04-04
JavaScript中報(bào)錯(cuò)Cannot?set?properties?of?undefined?(settin
這篇文章主要介紹了JavaScript中報(bào)錯(cuò)Cannot?set?properties?of?undefined?(setting?'1')的解決方案,文中通過(guò)代碼介紹的非常詳細(xì),對(duì)大家學(xué)習(xí)或使用js具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2025-03-03
學(xué)著js的繼承，自己也寫(xiě)了個(gè)。感覺(jué)不是很好?，F(xiàn)在很多代碼都封裝成類(lèi)。2010-08-08
JavaScript Archive Network 集合...2007-05-05
兩種常用的javascript數(shù)組去重方法思路及代碼
第一種是常規(guī)的方法:建一個(gè)新的數(shù)組存放結(jié)果,for循環(huán)中每次從原數(shù)組中取出一個(gè)元素，用indexOf查找新數(shù)組中是否有該元素，至于第二種詳細(xì)的看下本文哦2013-03-03
javascript支持區(qū)號(hào)輸入的省市二級(jí)聯(lián)動(dòng)下拉菜單
javascript支持區(qū)號(hào)輸入的省市二級(jí)聯(lián)動(dòng)下拉菜單...2007-05-05