JavaScript - Timer Function In Js - Can You Help?
Hi everyone
I need a function which will record the amount of time that a window has been open for. Upon load, the function should start a timer, and upon close, the function should store the number of minutes and seconds to a field on the form called 'Time'. My concern with this is whether you can write to a DOM element upon closre of a window, or whether we loose that ability as soon as the close event happens? if you could help priovide ideas around doing this then I'd be very grateful Dom Similar TutorialsHi, I am new to javascript. I have isolated a problem and I am trying to fix it. I am hoping someone could lend assistance to my problem. I'm sure it's minor, but I can't seem to figure out WTF is going on. Thanks in advance for any help you may provide. Rodg This script is saved as timer.php. I downloaded it from this site. It is a live server timer that displays the server time in your browser. This code works fine. My problem lies here. I am calling this script from 'showusers.php' as: Code: <?PHP echo "<p><b>Current Server Time: </b><span id="servertime"></span></p>"; ?> The timer as written below, saved as 'timer.php' works fine. When I use my original page 'showusers.php' it doesn't want to work. 'showusers.php' loads java in the header and has a src file= .js. I tried making this file a .php to see if there was a problem, but it did not help. My timer outputs the following: Current Server Time: undefined NaN, NaN NaN:NaN:NaN Also, a previous call to the same 'src=java.js' stopped working in 'showusers.php'. I assume the problem lies in the 'var currenttime=' line 12 in timer.php If I comment the 'var currenttime=' line in my .js file, the call to 'id=AccessInfo' in 'showusers.php' works fine. Is this a javascript error or a PHP error? http://173.34.134.4/showusers.php // View source ---> not working http://173.34.134.4/timer.php //View source ---> Working ok Good code: timer.php Code: <body> <script type="text/javascript"> // Current Server Time script (SSI or PHP)- By JavaScriptKit.com (http://www.javascriptkit.com) // For this and over 400+ free scripts, visit JavaScript Kit- http://www.javascriptkit.com/ // This notice must stay intact for use. //Depending on whether your page supports SSI (.shtml) or PHP (.php), UNCOMMENT the line below your page supports and COMMENT the one it does not: //Default is that SSI method is uncommented, and PHP is commented: //var currenttime = '<!--#config timefmt="%B %d, %Y %H:%M:%S"--><!--#echo var="DATE_LOCAL" -->' //SSI method of getting server date var currenttime = '<?PHP print date("F d, Y H:i:s", time())?>' //PHP method of getting server date ///////////Stop editting here///////////////////////////////// var montharray=new Array("January","February","March","April","May","June","July","August","September","October","November","December") var serverdate=new Date(currenttime) function padlength(what){ var output=(what.toString().length==1)? "0"+what : what return output } function displaytime(){ serverdate.setSeconds(serverdate.getSeconds()+1) var datestring=montharray[serverdate.getMonth()]+" "+padlength(serverdate.getDate())+", "+serverdate.getFullYear() var timestring=padlength(serverdate.getHours())+":"+padlength(serverdate.getMinutes())+":"+padlength(serverdate.getSeconds()) document.getElementById("servertime").innerHTML=datestring+" "+timestring } window.onload=function(){ setInterval("displaytime()", 1000) } </script> <p><b>Current Server Time:</b> <span id="servertime"></span></p> <p style="font: normal 11px Arial">This free script provided by<br /> <a href="http://www.javascriptkit.com">JavaScript Kit</a></p> </body> 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; } } 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 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> 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 Please understand that i have looked through the different timers on the JavaScript section but did not find any that can do what i am looking for and i don't know programming to edit any of them. I would like to have a countdown timer on my website that will count down from 12:00:01 am server time and end at midnight again of the same day (the clock should count down a full 24 hours) then it will automatically reset itself and count down again each and every day starting from 1 second after midnight. The count down should display hours : minutes : seconds just like a digital watch. I would also like to it to go with the server time and not client computer time so it will only count down according to the server time. One more thing .... each day a new trivia question will be posted and ppl have 1 day to answer the trivia question for a chance to win something (that is why the script is counting down). Will the script be able to automatically load a new trivia each day at midnight as the timer resets or do i have to load the trivia manually? If im getting way out of my head here then lets forget this last part. If it can be done i will certainly appreciate the advice. 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; Hello, i need one script, which will remove the timer and i’ll be able to start download the file without waiting the time… Okay, i dont need such things… I need only one simple thing… Without any premium accounts… It should remove the timer (30 sec)… That’s everything i want… Link: *HIDEN* Thanks. Contact me via pm or skype - bahurz1 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 new to javascript , i have a game when 2 or more players enter the game a button appears one of the players clicks the button the game starts, what i want to do is when 2 or more players join the game i want the game to start, and not start by using the button. here is the code for the button. PHP Code: if(($hand == '') && ($numplayers > 1)){ ?> var betbuttons = '<'; betbuttons += 'input type="button" name="Button" value="<? echo addslashes($BUTTON_START); ?>" class="betbuttons" onclick="push_action(\'start\');">'; I am trying to make an image show then stop showing. I am trying to use: document.image.src This is the code. <HTML> <HEAD> <!-- BlackHole Pointer Display/Hide --> <script language="javascript"> <!-- function blkhlpntr() { document.images.src="http://www.proamrodeo.com/gif/menu/blackholepointer.gif; setTimeout('blkhlpntr()',5000) } //--> </script> </HEAD> <BODY onload="setTimeout('blkhlpntr()',5000)" BGCOLOR="#FFFFFF"> <!-- Black Hole Pointer --> <DIV id="blkhlpntr" STYLE="position:absolute; top:70px; left:840px; width:90px; border-width:0; visibility:visible; z-index:1"> <img src="http://www.proamrodeo.com/gif/menu/blackholepointer.gif" width="15" height="48"> </DIV> </BODY> </HTML> This should load two(2) of the images to test it anyway. I keep getting an error message that document.image.src is null. Hi guys, I'm building a page which has a countdown timer on it (days, hours, mins) and I honestly really don't know much about Javascript at all. I have spent over half a day looking through tutorials and code snippets and think I'm close, but I'm still having trouble with the output. I need to pull out the days/hours/mins separately as they sit within different HTML elements. The days appear to be displaying correctly, but the hours is showing 3 digits instead of 2 and the mins is showing 5 digits instead of 2: 32 days, 764 hours, 45845 mins Here is the code I'm using: Code: var now = new Date(); var theevent = new Date("June 18 2011 10:00:00"); var seconds = (theevent - now) / 1000; var mins = seconds / 60; var hours = mins / 60; var days = hours / 24; ID=window.setTimeout("update();", 1000); function update() { now = new Date(); seconds = (theevent - now) / 1000; seconds = Math.round(seconds); mins = seconds / 60; mins = Math.round(mins); hours = mins / 60; hours = Math.round(hours); days = hours / 24; days = Math.round(days); document.getElementById('days').innerHTML = days; document.getElementById('hours').innerHTML = hours; document.getElementById('mins').innerHTML = mins; ID=window.setTimeout("update();",1000); } Thanks a bunch in advance... Hi people, Im really stuck, I have a script I want to load when my page opens, I can et it to do this fine, but I want to be able to input a delay time, any time I want. So my page loads, 1,2,3,4,5 then my script kicks in. I have searched hi and low, but my understanding with JS is very basic, but I am willing myself to learn. Thank you very much in advance for your help. Bev 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 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 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, 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 |