欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

Atitit.随时间变色特效?-包厢管理系统的规划_html/css_WEB-ITnose

程序员文章站 2022-05-30 20:16:36
...
Atitit.随时间变色特效 ---包厢管理系统的规划

1 流程滴定仪

定义的参数 颜色、位置(开始值,结束值,当前比值) 》》返回数值

可以后期处理转成双位16进制码

分别定义复合颜色的,每个单色数值,然后join

回调事件,要应用的对象。。

2 还需要的功能

暂停功能

统一增加时间功能

统一减少时间

作者:: 老哇的爪子 Attilax 艾龙, EMAIL:1466519819@qq.com

3 Overview图片如下

4 ---code

function getCurVal(startVal,endVal,percent)

{

var rang= Math.abs( startVal-endVal);

var adjus_count= Math.round ( percent*rang);

if(startVal>endVal) //reduce

var cur_val=startVal-adjus_count;

else //up load

var cur_val=startVal+adjus_count;

return cur_val;

}

5 ---code22

var min_color=121;

var max_color=240;

var finish_percent=past_time/dura;

var remain_prercent=remain_time/dura;

//sec color

var finishi_color_oct= Math.round (finish_percent*5);

var finishi_color_hex=str_pad(finishi_color_oct.toString(16),2,"0",STR_PAD_LEFT );

//fist cloor

var rang=max_color-min_color;

var adjus_count= Math.round ( remain_prercent*rang);

var remain_color_ocr=121+adjus_count;

var remain_color_hex=str_pad(remain_color_ocr.toString(16) ,2,"0",STR_PAD_LEFT );

// finishi_color_hex="00";

var blue_str="#"+finishi_color_hex+remain_color_hex+"00";

if(remain_time>0){

$(element).css("background-image","none");

$(element).css("background-color",blue_str);

}