...

View Full Version : newbie. Creating up/counters the user sees



Roy Gardiner
07-15-2004, 12:41 PM
Would someone kindly point me to an example of an on-screen counter which runs up (or down) as the user holds down a button, stops when the user lifts off?

No doubt this is dead simple and a :mad: to ask, but my book does not carry an example.

Kor
07-15-2004, 01:25 PM
Something like this?:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
n=0;
timer=1000;//delay in milliseconds
function counter(q){
if(q=='+'){n++}
else{n--}
document.getElementById('count').innerHTML=n
con = setTimeout('counter(\''+q+'\')',timer)
}
function stopC(){
clearTimeout(con)
}
</script>
</head>
<body>
<input type="button" value="+" onmousedown="counter('+')" onmouseup="stopC()">
&nbsp;
<input type="button" value="-" onmousedown="counter('-')" onmouseup="stopC()">
<br>
<br>
<div id="count">0</div>
</body>
</html>

Roy Gardiner
07-15-2004, 01:32 PM
Exactly, thank you Mr KOR. :thumbsup:

Aren't these forums wonderful things? ;)

Now all I have to do is figure out how it works... :confused:

Roy Gardiner
07-15-2004, 01:51 PM
On looking at the code, Mr KOR, it looks like an example created to illustrate the solution to my problem, rather than one taken from existing code.

If so that's :thumbsup: :thumbsup: :thumbsup:

as well as the :thumbsup: in my first thank-you.

Kor
07-15-2004, 01:55 PM
it looks like an example created to illustrate the solution to my problem

Exactly. I sow your post, I knew how to do it, not very intricate when you know how, and post the replay. We all are glad when we can help anyone, as we were at the time, helped gracefully by others
Cheers :thumbsup:

Number_Nineteen
07-15-2004, 05:13 PM
I like that. Throw in an if statement to stop the counter if n == 0.

Roy Sinclair
07-15-2004, 07:49 PM
Actually there's a very nice example of the desired script in the "Post a Javascript" forum: http://www.codingforums.com/showthread.php?t=34958

(Make sure you go to the bottom of the thread to get the latest version).

The advantage of the one posted there is that it can be used several times on the same page without having to duplicate the code. If you decide to use it make sure you also give a thank you to GlennV who wrote it.

Kor
07-16-2004, 08:58 AM
To Number_Ninteen



<script language="JavaScript" type="text/JavaScript">
n=0;
timer=1000;//delay in milliseconds
function counter(q){
if(q=='+'){n++}
else{n--}
document.getElementById('count').innerHTML=n;
if(n==0){stopC()}
else{
con = setTimeout('counter(\''+q+'\')',timer)
}
}
function stopC(){
clearTimeout(con)
}
</script>

Roy Gardiner
07-16-2004, 09:19 AM
Actually there's a very nice example of the desired script in the "Post a Javascript" forum: http://www.codingforums.com/showthread.php?t=34958

(Make sure you go to the bottom of the thread to get the latest version).

The advantage of the one posted there is that it can be used several times on the same page without having to duplicate the code. If you decide to use it make sure you also give a thank you to GlennV who wrote it. hmm, well something's not right here. I went to the end and saved the last version I saw, but for me now none of it works except the military hours counter. And the script is huge by comparison. I'm on IE6.0.

For the newbie like me (a minority, I know) Mr KOR's version - small, neat and to the point - is much more educational.

I don't intend criticism of GlennV (far from it) just to say that the sophisticates here will understand his solution and for any simpletons like me a smaller version works better (thanks again).

glenngv
07-16-2004, 10:12 AM
hmm, well something's not right here. I went to the end and saved the last version I saw, but for me now none of it works except the military hours counter. And the script is huge by comparison. I'm on IE6.0.

But did you take note of the error I found?


Good catch but there should be no .value because you're passing a number not a textfield object.

(me.hasLeadingZero && defaultValue.value < 10)

I know the code is long but it is flexible and has advantages which Roy earlier mentioned. I'm not forcing you to use it though.

Kor
07-16-2004, 10:59 AM
Glenn's script is OK as he is a remarcable coder, better than me. It is not a long code regarding to the complex tasks it solves. I was only to give Roy a precise answer to his question, without guessing about a more intricate code (anyway, there was no sense to rebuild it if there is already Glenn's variant which, I repeat, is very good.) Thus, this small quarell has no sense :thumbsup:

Roy Gardiner
07-16-2004, 12:30 PM
But did you take note of the error I found? :mad: Ok now.
I know the code is long but it is flexible and has advantages which Roy earlier mentioned. I'm not forcing you to use it though. Please don't misunderstand, the only reason I commented is that Mr KOR's is a simple solution, yours is (I guess) comprehensive. That I don't understand most of it is my challenge, and is hardly your fault. I am studying and learning now. :confused:

glenngv
07-16-2004, 12:43 PM
There was no misunderstanding whatsoever. We're here to lay down our suggestions. It's up to you which one to choose. No problem there. ;)

Roy Sinclair
07-16-2004, 06:34 PM
I didn't mean to start anything either, Kor's code is good but I thought it might be worth mentioning Glennv's code too in case you were going to need multiple spinners. The code is also worth examining on it's own just to learn new techniques that might be useful in the future as you write your own code.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum