【網(wǎng)站公司建設(shè)】
②addColorStop()方法在漸變中的某一點(diǎn)添加一個(gè)顏色變化,語(yǔ)法格式為:
addColorStop(offset, color)
其中的參數(shù)含義如下。
offset:這是一個(gè)范圍在0.0~1.0之間的浮點(diǎn)值,表示漸變的開(kāi)始點(diǎn)和結(jié)束點(diǎn)之間的偏移量。offset為0對(duì)應(yīng)開(kāi)始點(diǎn),offset為l對(duì)應(yīng)結(jié)束點(diǎn)。
color:指定offset顯示的顏色,沿著漸變某一點(diǎn)的顏色是根據(jù)這個(gè)值以及任何其他
的色標(biāo)來(lái)插值的。
【案例5-13l繪制線(xiàn)性漸變和徑向漸變。
【案例展示】本例文件5-13.html在瀏覽器中的顯示效果如圖
【學(xué)習(xí)目標(biāo)】掌握繪制線(xiàn)性漸變和徑向漸變的方法。
【知識(shí)要點(diǎn)】掌握繪制漸變的相關(guān)方法和屬性。
代碼如下:
<! doctype html>
<html>
<head>
<meta charset”gb2312”>
<title>繪制漸變</title>
<,head>
<body>
5-14所示。
圖5-14頁(yè)面的顯示效果
<canvas id="myCanvas" width="200" height="100" style="border:lpx solid #c3c3c3;">
您的瀏覽器不支持canvas元素.
</canvas>
<script type="text/j avascript">
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
var grd=cxt.createLinearGradient(1 0,0,1 80,3 0); //繪制線(xiàn)性漸變