html5 更新图片颜色示例代码

代码如下:
0 e2 E% q% c/ |' I  H<canvas id=c1 width=1220 height = 880 style=background: none repeat scroll 0% 0% transparent; ></canvas>
<script>
, c# w2 X+ b# ?( zvar cid = c1;
var image = new image();
. h" E: a3 j7 q( u' ximage.src = eye/item_eye_1.png;
7 f8 ^' R- U9 b) timage.onload = function () {
4 H! H" g6 r% f0 drecolorimage(cid,image, 0, 0, 0, 255, 0, 0);
2 G) i2 R, ^# [+ M5 N8 `. t" t}
* `$ Z- m; p  r4 }9 M3 d# z+ Gfunction recolorimage(c,img, oldred, oldgreen, oldblue, newred, newgreen, newblue) {
! @( m" R& H# A2 I; e. pvar c = document.getelementbyid(c);
' L6 Q# B( k, ?% g* Wvar ctx = c.getcontext(2d);
var w = img.width;
var h = img.height;
$ B9 Y1 q8 L+ X2 y/ c  m, Cc.width = w;
' _  `- W( f5 [1 Y  q  p1 Kc.height = h;
// draw the image on the temporary canvas
- Z9 w# W& w+ y# u' F) wctx.drawimage(img, 0, 0, w, h);
: r* I6 k- T; ^9 I9 Q// pull the entire image into an array of pixel data
var imagedata = ctx.getimagedata(0, 0, w, h);
// examine every pixel,
8 Y( f- R. K. K7 }' b// change any old rgb to the new-rgb
( j8 G3 r6 c- y- Y, S: f' [" [# gfor (var i = 0; i < imagedata.data.length; i += 4) {
// is this pixel the old rgb?
2 s* \1 H) X+ m2 M; T- g3 \0 ^% ?if (imagedata.data == oldred && imagedata.data[i + 1] == oldgreen && imagedata.data[i + 2] == oldblue) {
) Q3 @5 u4 y! i' U// change to your new rgb
7 j7 p: P- [2 T5 |2 O% {6 d2 O/ q3 S8 ?imagedata.data = newred;
6 N% A- e) ^4 g6 V% G4 ~- N& rimagedata.data[i + 1] = newgreen;
3 [. J1 L! y* E: limagedata.data[i + 2] = newblue;
}
}
5 P" [& k3 C+ Y0 W// put the altered data back on the canvas
/ ~* s0 @  ]/ o; A/ `; e4 {5 {ctx.putimagedata(imagedata, 0, 0);
  t/ Q  p+ z" v+ j}
" S( s* n- Y; l3 n4 Y</script>
3 J; t/ D1 U. F/ u4 N- |% {; M
更多网页制作信息请查看： 网页制作

看起来好~~像啊~~~~~

你这样的表现，就只配这几个字：窝囊废

呵呵 放心 如我算错 你以后来砸我的帖子 呵呵

现在做什么网站好？

现在做什么网站好？

您知道这个论坛的站长是谁吗？偷偷的告诉你他叫叶学得  好厉害的样子

哈哈~` 好久没有笑喽~

因删贴不及时所产生的任何法律（书法，基本法，劳动法，婚姻法，输入法，国际法，今日说法，与台湾关系法及文中涉及或可能涉及以及未及之法，各地治安管理条例）纠纷或责任本人概不负责。

本人在此留言均为网络上复制，用于检验本人电脑键盘录入、屏幕显示的机械、光电性能。并不代表本人局部或全部同意、支持或者反对楼主观点。