Looking for ..........

W

Willard Reese

I need a javascript that will show something like a thermometer where
the thermometer fluid can be periodically set to a certain level.
Something like they use to display progress in fund raising efforts.
(like Community Chest drives).
Can anyone help?

Hap Reese
 
F

Fabian

areese@no-spam bestnetpc.com (Willard Reese) hu kiteb:
I need a javascript that will show something like a thermometer where
the thermometer fluid can be periodically set to a certain level.
Something like they use to display progress in fund raising efforts.
(like Community Chest drives).
Can anyone help?

I'd implement this as a background gif with the basic thermometer shape,
and another gif as a red line. I'd then manipulate the height attribute
of teh second to stretch it to the desired height. I've no idea if
anything like this has been made before.


--
 
M

McKirahan

I need a javascript that will show something like a thermometer where
the thermometer fluid can be periodically set to a certain level.
Something like they use to display progress in fund raising efforts.
(like Community Chest drives).
Can anyone help?

Hap Reese


You could just have several versions of a thermometer image each
representing a different level.

Here's an image that could serve as a base:

http://www.uwev.org/images/thermometer.gif
 
B

Bas Cost Budde

Fabian said:
areese@no-spam bestnetpc.com (Willard Reese) hu kiteb:




I'd implement this as a background gif with the basic thermometer shape,
and another gif as a red line. I'd then manipulate the height attribute
of teh second to stretch it to the desired height. I've no idea if
anything like this has been made before.

If you don't want to use graphics, you can experiment with a table cell
changing the border width from one side.
 
Y

Yann-Erwan Perio

Willard said:
I need a javascript that will show something like a thermometer where
the thermometer fluid can be periodically set to a certain level.

Using images can be good to provide some background appearance, and you
can then use javascript to have the thermometer level adjusted, changing
height of simple HTML div elements.


<style type="text/css">
div#container{
position:absolute;bottom:10%;right:10%;
width:20px;height:200px;
background:#c00;
border:ridge 1px #000;
overflow:hidden;
}
div#container div{
background:#eee;
line-height:0;
height:100%;
}
</style>

<script type="text/javascript">
onload=function(evt){
this["thermometer"]=function(){
var $th=null;

function getm(dir){
var
ptr_c=document.getElementById("container"),
ptr_t=ptr_c.getElementsByTagName("div")[0];
dir*=-1;
return function(m){
m=ptr_t.offsetHeight+dir*m;
if(0<m&&m<ptr_c.offsetHeight)
ptr_t.style.height=m+"px";
}
}

if(document.getElementById&&
document.getElementsByTagName){
$th={
up:getm(+1),
down:getm(-1)
};
}

return $th;
}();

if(this["thermometer"]){
setTimeout(
function(){
this["thermometer"]
[Math.random()<0.6?"up":"down"](Math.random()*5|0);
setTimeout(arguments.callee,40);
},
50
);
}
}
</script>

<div id="container"><div>&nbsp;</div></div>
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top