作者TonyQ (沉默是金。)
看板Ajax
标题[js] 简易 color animate 实做
时间Wed May 12 05:45:14 2010
刚好手边需要用到,作一个来玩玩。XD
目标是背景变成红色转白色,
这个网路上有jQuery color animate plug-in,
不过懒得载 jQuery 的话也可以自己作一个来玩。
usage::
color_animate(document.getElementById("testNode"));
以这种效果而言,只是数字加加减减要自己用心而已。
-----------------------------------------------------
function pad(str){return (str.length>1)?""+str:"0"+str;}
function getHex(r,g,b){
return "#"+pad(r.toString(16))
+pad(g.toString(16))
+pad(b.toString(16));
}
function color_animate(item){
var r=255,g=0,b=0;
item.style.background=getHex(r,g,b);
setTimeout(function(){
var tim=setInterval(function() {
g+=20;
b+=20;
item.style.background=getHex(r,g,b);
if(b>255){
item.style.background='';
clearInterval(tim);
}
}, 50);
},2000);
}
--
What do you want to have ? / What do you have?
从书本中,你可以发现我的各种兴趣。
从CD中,你可以了解我所喜欢的偶像明星。
或许从文字你很难以了解一个人,但从物品可以。
My PPolis , My past. http://ppolis.tw/user/Tony
--
※ 发信站: 批踢踢实业坊(ptt.cc)
◆ From: 116.59.162.203
1F:推 chenshin0719:推:) 05/12 17:06