|
JavaScript - Count Down Timer - Not Accepting Value Please Help
I'm trying to make a countdown timer, it works fine if I define the value myself from where it has to start. However, when I try to take output from the user it says undefined and 'Nan'.
Here is the code of html Code: <html> <head> <script type="text/javascript" src = "experimento2.js"></script> <link rel="stylesheet" type="text/css" href="experimento2.css" /> </head> <body> <h1> Count DOWn!</h1> Enter the number to begin countdown with : <input type = "text" id = "user" onchange = "input()"/> <input type="button" onclick = "timedCount()" value = "begin" id = "begin" /> <input type = "button" onclick="stopCount()" value = "stop" id = "end" /><br> <div id = "start" >00 </div> </body> </html> Here is the script: Code: var t;
var l =document.getElementById("user").value;
var c = l;
function timedCount()
{
document.getElementById('start').innerHTML=c;
c=c-1;
t=setTimeout("timedCount()",1000);
}
function stopCount()
{
clearTimeout(t);
}
Basically my problem is that if I give c a value like c = 30. it works fine. But when I try to take the input , it gives an undefined error. Similar TutorialsHi All, Not sure if you can help, I'm having some issues with a count down timer that outputs a time until deadline. It was all working fine however since the clocks have gone back in the UK it is a hour out. However I was under the impression that the UTCHours called GMT time with the clocks going forward & backwards. - if this is not the case how do I call the correct GMT time or the server time? The server time is correct however the script displays the wrong message. Here is the script: [JavaScript] var lastimage = ""; function checkTimer() { function b(a, b, c) { - Pastebin.com Thanks! I'm trying to make a count-up timer that counts to 100 or 1000 then adds 1 to another number. i would like the timer speed to be adjustable if possible...i'm kinda new to javascript so any help with this would be appreciated. Hi, I'm trying to adapt a script I found online for a timer that goes in my webpage. The timer counts from 30 seconds down to 0. I've adapted it so that when it reaches 0 it goes back up to 30, but I was wondering how can I make it so that after a certain number of loops through the timer, it executes some other (non-JS) code instead of just doing the timer forever? I've introduced a variable t to try to do this, but when I put in if(t>1) {break} at the bottom, the timer doesn't work properly anymore (it doesn't display a number in the box). Thanks a lot for any help . <script> <!-- // var t=0 var milisec=0 var seconds=30 document.counter.d2.value='30' function display(){ if (milisec<=0){ milisec=9 seconds-=1 } if (seconds<=-1){ milisec=0 seconds=30 t+=1 } else milisec-=1 document.counter.d2.value=seconds+"."+milisec setTimeout("display()",100) } display() --> </script> I've been scouring google and multiple forums for an answer to this, and nothing really 'hit the nail on the head' as far as what I am trying to do. What I have is a game server status window in an iframe on my site, which is already set to auto refresh every 30 seconds. (It was a task in itself to get rid of the refresh flicker btw) Now, the problem is, people coming to the site don't know 'when' the 30 seconds started, even though it starts when they enter the site. This is causing confusion and many questions (even though they can just wait the 30 seconds and watch it change). I found a forum on dynamicdrive that had a script which counted down, but the counter didn't reset to 30 seconds, which made it pretty much useless. All I want it to say is "next refresh in 30 seconds" under the iframe window, and count down. Beings as the php file that the iframe is linked to already starts timing itself upon page entry, I just need a timer that displays a countdown that also starts on page entry. I just want to show people that it will be refreshing when the timer hits "0" Is this possible? I've spent 4 hours trying different scripts and nothing does what I want (they either refreshed the entire page, or the timers wouldn't restart), so I am starting pretty much from scratch with this, and I am throwing this to the masters. If anyone can help, PLEASE let me know! Thanks in advance - Nitro Hi, I am new to programming and I am trying to write a code that will time how long it takes for you to write a word. First you input the word you would like to write, and than after you have pressed enter I want the program to "feel" when you start writing the word, at that point the timer should start. And then it shall know when you have completed the word and in that moment stop the timer. I have a built a timer that works fine, see startCounter() but i want it to be executed as i described above... This is the code: Code: <div>
<div class="inputBox">
<input id="textBox" type="text" placeholder=" What word would you like to time?" onKeydown="Javascript: if (event.keyCode==13) hello();">
<input type="button" value="RushWrite" id="Btn" onclick="hello()"></input>
<script>
function hello() {
if (textBox.value != "") {
var wordInput = document.getElementById("textBox").value;
document.getElementById("textBox").placeholder=" Let's RushWrite: "+wordInput;
textBox.value = "";
document.getElementById("Btn").value="GoGo!";
document.getElementById("time").innerHTML="00.00";
};
}
</script>
<button id="time" type="text"></button>
<script>
function startCounter(){
var counter = 0;
setInterval(function () {
++counter;
document.getElementById("time").innerHTML=(counter);
}, 1000);
};
</script>
<script>
</script>
</div>
</div>
Thankful for any advise! Background on my task: My page accepts a url with various parameters passed in querystring. One of the parameter is the URL of the Image I wish to display on the page. I save this URL in a variable "imagesource" To ensure the image is not bigger than the size permitted, I use image object to get the height and width of the image. Now here's my code: function foo(){ ...... var imagesource = URL of the image; .... var newImg = new Image(); newImg.src = imagesource; var height = newImg.height; var width = newImg.width; .... } Now, say if, imagesource = http://www.yourwebsite.com/yourimage.jpg I expect newimage.src to be http://www.yourwebsite.com/yourimage.jpg But I get newimage.src = http://www.mywebsite.com/http://www.yourwebsite.com/yourimage.jpg Browser in use : IE 8 (if it matters in this case) Am I wrong in my assumption to begin with? I'm trying to build a time but it isn't displaying on screen Code: <html>
<head>
<script type="text/javascript">
function StartCounting(){
setInterval("DoCounting()", 1000)
}
function DoCounting(){
var obj =getElementbyId('countingtext');
obj.innerHTML = '' + Counter;
Counter++;
if( Counter > 10)
{
Counter = 0;
document.writeln("Timer Reset");
}
}
</script>
</head>
<body onload= "StartCounting()">
Here it is:<span id="countingtext"></span>
</body>
</html>
How could I lock an "Enter" link on an intro page with a 30 second timer that is displayed on the bottom of the page and disables the "Enter" link so that visitors have to wait 30 seconds to read the rules/announcements before entering?
Hi I am working on a chat application and am a bit stuck...In the database I have a field status which is set 1 for online and 0 for offline (PHP/MySQL)(at time of logging in/out), this shows the users status on a webpage. What I need is to know if there is a way I can set a timer so that if the user has been inactive for X amount of time, the database is auto updated and user is offline (1 set to 0). Thanks for any help I recieve Alright, im trying for my project to make 1 div scroll through a list of pictures. I have it so that it starts when I click the button. Now what im trying to do is after I start the timer I have the button changing values to 'Pause' instead of 'Start' but I can't figure out how to code to make the timer pause when i click the button again. Code: HTML:
<input id="timer"
style="position: absolute; font-size: 50px;
background-color: red;
top:750px;left: 800px;
height: 75px; width: 120px;"
type="button" value="Start"
onclick="myTimer = setInterval('picture()', 2000);
document.getElementById('timer').value = 'Pause';">
Code: Javascript:
function picture()
{
soccerImg.src = soccerPic[state];
state++;
if(state == 35)
{
state = 0;
}
}
Hi everyone, I need a countdown timer that will count down exactly from a time that i set. i want it to count in this format: hh:mm:ss. i need it for a online shop , at the main page there are few products for sell and i want each one of them to have its own countdown timer. in addition when it will get to 00:00:00 i want that it will automatically add like 5 hours and continue counting down.. P.s i dont know javascript.. thanks guys I am making a website and the page is oriented around a countdown system. If the timer ever reaches 0, the whole thing will stop. Below are the specifics: I need a countdown timer that runs from 30 seconds to 0 seconds. If the timer is at 0 seconds, the script runs php code #1 (which makes the timer stop and if any user refreshes the page, it will still stay at zero). There is also two buttons. If user clicks on button #1, the timer will get reset to 30 seconds remaining. Then the script will run the php code #2 (which allows the timer to begin counting down again from 30 seconds). If user clicks on button #2, the timer will get reset to 5 seconds remaining and same thing follows as the first button. And obviously the timer should show the same number (seconds remaining) for all the users on the website! Thank You Hello everyone. I'm using the script Old Pedant posted here (huge thanks man!), however, I'm looking to have the timer display six numbers at all times. For example: If the timer has 15 hours, 35 minutes, and 10 seconds left it is currently displaying as: 15:35:10 - Perfect! If the timer has 5 hours, 35 minutes, and 10 seconds left it is currently displaying as: 5:35:10 - Humm, not so perfect. In the second example, would like the timer to keep a zero in front of the hours when ever it drops below 10. So the second example should display as: 05:35:10. Any help is greatly appreciated. Posted below is the modified code I'm using. Thanks! Code: <html>
<head>
<script type="text/javascript">
// really really simple to get the time from the server
// this is for an ASP server:
//var serverTime = <%= DateDiff("s",#1/1/1970#,Now())%>;
// PHP Servers:
var serverTime = <?php echo time(); ?>;
// serverTime will hold the number of seconds since 1/1/1970 0:00:00 as it is on the server
// we must adjust it to compensate for GMT offset
// My server is on Pacific Daylight Time, so 7 hours offset:
serverTime += 0 * 3600; // 7 hours, 3600 seconds per hour
// NOTE: This adjustment MAY NOT be needed for PHP servers...I dunno.
//
// so calculate how far off the client is from the server:
var now = new Date();
var clientTime = now.getTime(); // number of *milliseconds* since 1/1/1970 0:00:00 on client
serverTime *= 1000; // convert server time to milliseconds, as well
// the client and server disagree by this much:
var clockOff = serverTime - clientTime; // could well be negative!
// hopefully you can see, from basic algebra, that
// serverTime = clientTime + clockOff
// we want target to be 0:00:00 of next day
var target = new Date( serverTime ); // serverTime in JS form
// so bump the day by one and leave time as 0,0,0:
target = new Date( target.getFullYear(), target.getMonth(), target.getDate() + 1 );
// and now ready for our timer countdown:
var ticker = null; // the interval timer
function countdown( )
{
var clientNow = ( new Date() ).getTime();
var serverNow = clientNow + clockOff; // see? this is where we use that offset!
var millisLeft = target.getTime() - serverNow; // milliseconds until server target time
var secsLeft = Math.round( millisLeft / 1000 );
var timeLeft;
var timeLeftWords;
if ( secsLeft <= 0 )
{
timeLeftWords = "Expired!";
timeLeft = "0 days 00:00:00";
clearInterval( ticker );
} else {
var secs = secsLeft % 60;
var minsLeft = Math.floor( secsLeft / 60 );
var mins = minsLeft % 60;
var hrsLeft = Math.floor( minsLeft / 60 );
var hrs = hrsLeft % 24;
var days = Math.floor( hrsLeft / 24 );
timeLeftWords = days + " days, " + hrs + " hours, " + mins + " minutes, " + secs + " seconds";
timeLeft =
+ (hrs < 10 ? "0" : "" ) + hrs + ":"
+ (mins < 10 ? "0" : "" ) + mins + ":"
+ (secs < 10 ? "0" : "" ) + secs;
}
document.getElementById("ticktock").innerHTML = timeLeft;
}
function startup( )
{
countdown(); // first time
setInterval( countdown, 1000 ); // then once a second
}
</script>
</head>
<body onload="startup()">
Time: <span id="ticktock"></span><br/>
</body>
</html>
hi , im newbie here and need some help from all the guru here , can some 1 help me out with iframe , i want an iframe can do auto reload on list sites after specific time , example after 10 seconds ifram will open google.com and after 10 seconds again iframe will reload yahoo.com and so on. please some one help me , i had try to search on google and others but still can find it , i apreciate all the help thank you hi, i am currently trying to write a javascript program; it would be for a library reservation system. this would be put on the computers with sessions from 15 minutes to 2 hours (in 15 minute chunks i.e, 15, 30, 45, 1 hour). this program would countdown the remaining time on their session, with pop-up messages appearing every so often. at the end of the session, the program will have to automatically log the user off. i am a student studying javascript, and haven't got any idea how to even start can anyone give me a helping hand to get me started. thanks index.php Code: <a href="#" onClick="getTimer();return false;">Show Timer</a> <br /> <div id="test"></div> getTimer.js Code: function getTimer() {
new Ajax.Request('filegoeshere',
{
onSuccess: function(req)
{eval(req.responseText);},
onFailu function(){ alert('Something went wrong...') }
});
}
timer.php Code: <?php echo "$('test').innerHTML = '<form><input type=\"text\" name=\"timer\" id=\"timer\" size=\"8\" style=\"text-align: center;\" /></form>';"; ?>
var seconds= 30
$('timer').value='30'
function display() {
seconds--;
if (seconds<=-1){
seconds=30
}
else
$('timer').value=seconds;
setTimeout("display()",1000)
}
display()
Everything seems to work, but the once the timer is in the input box, after the request, it get's stuck on 29, and will not continue counting down, and I can't seem to get it to work. I am using ProtoType with this, and I did just take that little part out of the index.php file, since that is all that is needed from that file. Hi All, I am trying to set up a countdown function that will be called on the click of a button. Function is below Code:
function countDown(sec, min) {
sec--;
if (sec == -01) {
sec = 59;
min = min - 1;
} else {
min = min;
}
if (sec<=9) { sec = "0" + sec; }
time = (min<=9 ? "0" + min : min) + " min and " + sec + " sec ";
if (document.getElementById) { theTime.innerHTML = time; }
SD=window.setTimeout("countDown();", 1000);
if (min == '00' && sec == '00') { sec = "00"; window.clearTimeout(SD); }
}
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
if (oldonload) {
oldonload();
}
func();
}
}
}
addLoadEvent(function() {
});
However I get an error after one second. Script can be found here - http://www.jivalot.co.uk/m.php Can anyone help? Kind regards, Slate Hi everyone, I've had a mess around with java at college and can get my head around code pretty easily but I cant seem to fnid out how to get a Javascript timer to work. The timer is like the one of Swoopo where it counts down to zero. When a user places a bid it should add on time such as 10 seconds. First of all what would be the best way of running a timer? A cron-job? Next problem is adding the time and getting it to update in everyones browser I have checked other posts on here but the posters seem to know the basics of my problems but Im not sure I do. any help would be appreciated Hello, I'm on a RPG game and they have a automatic logout timer to stop people from using bots to play, the only problem with it is, if someone lets the timer run out, it won't let the user log back in for a time (This time could be anywhere from 5 minutes to 3 hours from what other members have told me) Now java isn't my strong point (But I'm learning ^_^) and I'm not 100% sure if this error is related to java or some other code format. Using the develop tool in Safari I was able to find the code, and its telling me thats its java, I'm sorry if this is in the wrong place if its not Java after all. I'm wondering if looking over this code, someone might be able to find the problem or might have any tips to make it work better. (Note; I'm not the admin or owner of the RPG, but the owner hasnt done anything about it mainly cause they are to lazy I think?? or might not know how to fix it. PHP Code: var c_reloadwidth3=200 var countDownTime3=countDownInterval3+1; function countDown3(){ countDownTime3--; if (countDownTime3 <=0){ countDownTime3=countDownInterval3; clearTimeout(counter3) window.location.reload() return } if (document.all) //if IE 4+ document.all.countDownText3.innerText = Math.floor(countDownTime3 / 60)+":"+(countDownTime3 % 60)+" "; else if (document.getElementById) //else if NS6+ document.getElementById("countDownText3").innerHTML= Math.floor(countDownTime3 / 60)+":"+(countDownTime3 % 60)+" " else if (document.layers){ document.c_reload.document.c_reload3.document.write('<b id="countDownText3">'+countDownTime3+' </b>') document.c_reload.document.c_reload3.document.close() } counter3=setTimeout("countDown3()", 1000); } function startit3(){ if (document.all||document.getElementById) document.write('<b id="countDownText3">'+countDownTime3+' </b>') countDown3() } For all I know it could be another script causing it to do it, but this is a start to help try and fix the problem. Thank you to anyone who helps. - zerobeat, Jack. Hi folks, I am in need of a functionality for a system where in there PHP mysql system having a table bid which has columns(bid_product, "createtime") basically if the user does not bid for the product within 20 hours the bid will close for this i need to display a timer which keeps counting till 20 + hours of the create time, After a long search for timers i finally found a .Js which would work just fine for static values within the .js script when i tried to pass values from my database the timer does not change on itself but each time i have to refresh to check the time left. Please have a look at the code and let me know what could be wrong testingtime.php Code:
<!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=iso-8859-1" />
<title>Vott</title>
<script type="text/javascript" src="js/testtime.js"></script>
<style>
p.timer{font-size:15px; color:#43C6DB; border: 2px solid #fc0;width: 100px; position: absolute; top: 350px; left: 375px;}
</style>
</head>
<body>
<table style="background-color: #CCC" width="100%" border="0" cellpadding="12">
<tr>
<td width="78%"><h1>My Logo Image</h1></td>
</tr>
</table>
<span class="bids">
<p class="timer"><b>bid Closes in :</br>
<span id="timeleft"> <script>timeleft('<?php print($bid['createtime']); ?>')</script>
</span></b></p></span></br></br>
</body>
</html>
The Javascript code Code: var eventtext = "Left"; // text that appears next to the time left
var endtext = "bids Closed!!"; // text that appears when the target has been reached
function timeleft(mydate){
// Split timestamp into [ Y, M, D, h, m, s ]
var t = mydate.split(/[- :]/);
// Apply each element to the Date function
var date = new Date(t[0], t[1]-1, t[2], t[3], t[4], t[5]);
// -> Wed Jun 09 2010 13:12:01 GMT+0100 (GMT Daylight Time)
var year = date.getYear(); // in what year will your target be reached?
var month = date.getMonth(); // value between 0 and 11 (0=january,1=february,...,11=december)
var day = date.getDate(); // between 1 and 31
var hour =date.getHours(); // between 0 and 24
var minute = date.getMinutes(); // between 0 and 60
var second = date.getSeconds(); // between 0 and 60
var end = new Date(year,month,day,hour,minute,second);
end.setMinutes(end.getMinutes() + 50);
var now = new Date();
if(now.getYear() < 1900)
yr = now.getYear() + 1900;
var sec = end.getSeconds() - now.getSeconds();
var min = end.getMinutes() - now.getMinutes();
var hr = end.getHours() - now.getHours();
var dy = end.getDate() - now.getDate();
var mnth = end.getMonth() - now.getMonth();
var yr = year - yr;
var daysinmnth = 32 - new Date(now.getYear(),now.getMonth(), 32).getDate();
if(sec < 0){
sec = (sec+60)%60;
min--;
}
if(min < 0){
min = (min+60)%60;
hr--;
}
if(hr < 0){
hr = (hr+24)%24;
dy--;
}
if(dy < 0){
dy = (dy+daysinmnth)%daysinmnth;
mnth--;
}
if(mnth < 0){
mnth = (mnth+12)%12;
yr--;
}
var sectext = " Seconds ";
var mintext = " Minutes, and ";
var hrtext = " Hours, ";
var dytext = " Days, ";
var mnthtext = " Months, ";
var yrtext = " Years, ";
if (yr == 1)
yrtext = " Year, ";
if (mnth == 1)
mnthtext = " Month, ";
if (dy == 1)
dytext = " Day, ";
if (hr == 1)
hrtext = " Hour, ";
if (min == 1)
mintext = " Minute, and ";
if (sec == 1)
sectext = " second ";
if(now >= end){
document.getElementById("timeleft").innerHTML = endtext;
clearTimeout(timerID);
}
else{
//alert(now.getHours()+1);
document.getElementById("timeleft").innerHTML =min + ":" + sec;
//document.getElementById("timeleft").innerHTML = dy + dytext + hr + ":" + min + ":" + sec;
}
timerID = setTimeout("timeleft()", 1000);
}
window.onload = timeleft;
|
|||||||