首页新闻找找看学习计划

温度计的JS插件

0
悬赏园豆:10 [待解决问题]

有没有谁知道一些温度计,仪表盘类的JS插件,类似于

zhaodacheng的主页 zhaodacheng | 初学一级 | 园豆:25
提问于:2013-08-06 16:23
< >
分享
所有回答(2)
0

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>温度计</title> 
<script> 
var height=0;//温度计高度 
var topvalue=0;//层离上边的高度 
var zhi=0;//温度值  温度计高度/100 
var currwenduzhi=0;//当前的温度值 
var changezhi=0;//要改变的温度值 
function textchange() 
{ 

var textvalue=num.value; 
if(isNaN(textvalue)||textvalue.length==0) 
{ 
alert('请填写数字'); 
}else 
{ 
if(textvalue>100){alert('温度值太大');return;} 
var v=document.getElementById('test'); 
if(height==0) 
{ 
height=parseInt(v.style.height.replace('px',''));//得到层的高度 
zhi=height/100;//把高度分成100份 
}
if(topvalue==0) 
{ 
topvalue=parseInt(v.style.top.replace('px',''));//得到层离上边的距离 
} 
currwenduzhi=parseInt(v.style.height.replace('px',''))/zhi;//得到当前的温度值 
changezhi=parseInt(textvalue);//改变的温度值 

setInterval(changes,500);//实现渐动的效果 
} 
} 
function changes() 
{ 
if(currwenduzhi==changezhi) 
{ 
clearInterval(changes); 
} 
if(currwenduzhi>changezhi) 
{ 
currwenduzhi=currwenduzhi-1; 
}else 
{ 
currwenduzhi=currwenduzhi+1; 
} 
var v=document.getElementById('test'); 
var value0=zhi*currwenduzhi; 
v.style.height=value0+'px'; 
v.style.top=topvalue+(height-value0)+'px'; 
} 

</script> 
</head> 

<body> 
<div id="test" style="border:1px;background:red;width:4px;height:208px;position:absolute;left:17px;top:26px"></div> 
<img  id="wen" src="温度计.JPG"/> 
填写温度值:<input name="num" type='text' widht='20' > 
<button onclick='textchange()'>改变</button> 
</body> 
</html>

小兵仔 | 园豆:1240 (小虾三级) | 2013-08-07 11:50
0

下载一个 RGraph 库里,面有各种用canvas画的图表。

king_ | 园豆:177 (初学一级) | 2013-08-26 09:15
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册