html5教程实现Photoshop渐变色效果
发布时间：2013-12-04 16:14:45 作者：佚名 
我要评论
我要评论html5教程实现Photoshop渐变色效果，大家参考使用吧
复制代码
代码如下:<!DOCTYPE html><head>
<meta charset=utf-8>
<title>HTML5画线、圆、矩形</title>
<script src="<a href="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script">http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script</a>>
</head>
<script>
$(document).ready(function(){
var c=document.getElementById("drawbox");
var draw=c.getContext("2d"); //获取2d内容的引用，调用绘图API</p> <p>//指定渐变区块
var grd=draw.createLinearGradient(50,50,200,50); //坐标，长宽
grd.addColorStop(0,"black"); //起点颜色
grd.addColorStop(1,"green"); //终点颜色</p> <p>draw.fillStyle=grd; //设为填充样式
draw.fillRect(50,50,200,50); //填充进矩形内
})
</script>
</body>
<canvas id="drawbox" width="500" height="500"></canvas>
</body>
</html>
效果图：
相关文章
html5+canvas实现的会变色且会舞动的树动画特效源码
html5+canvas实现的会变色且会舞动的树动画特效源码是一段实现了，基于canvas实现的迅速增长，且会变色会舞动的树动画效果代码，本段代码适应于所有网页使用，有需要的朋友2017-03-16
这是一款基于html5实现的变色弹珠跳台阶游戏源码。用户可自由选择红、黄、紫三种颜色的变换顺序，游戏中快速变换台阶颜色使之与变色弹珠小球颜色一致2017-02-13
HTML5 canvas实现渐变色圆形进度条动画是一款带渐变色的圆形进度条动画特效jQuery插件jquery-circle-progress，进度条使用渐变色来填充2016-02-16使用javascript和HTML5 Canvas画的四渐变色播放按钮效果
这篇文章主要介绍了使用javascript和HTML5 Canvas画的四渐变色播放按钮效果,需要的朋友可以参考下2014-04-10html5 Canvas画图教程(4)—未闭合的路径及渐变色的填充方法
一般绘图的方式有两种，即填充和描边，前面的文章已经讲了描边的方法stroke，本文就讲一下Canvas中填充图形的方法2013-01-09- 这篇文章主要介绍了HTML中实现鼠标经停时整行（tr）变色的相关资料,需要的朋友可以参考下2017-06-13
最新评论