AllSeoHelp.com
Search the Entire Site
  • PHP
  • JavaScript
  • CSS
  • HTML
Learn VBA & Macros in 1 Week!

JavaScript - Stop 24 Hour Javascript Clock Continuing Past 24th Hour
Full Excel VBA Course - Beginner to Expert

Stop 24 Hour Javascript Clock Continuing Past 24th Hour

 View Content
Hi,

I have a webpage with a world clock.

On the clock page are 12 buttons (World Cities). When the user clicks these buttons. The time for the relevant world city is displayed. (The time is updated by an on.click function for each individual button. That either subtracts or adds the hours from GMT. For example. If the time is GMT 18:00:00. The user clicks the Paris button and the function adds 1 hour to result in 19:00:00)

However. If the GMT time is for example 21:00:00 and the user clicks the Tokyo button (GMT+9 hours). The time displayed is 30:00:00.

So I have been trying to work out how I can stop the time adding past 23:59:59.

This is probably so simple which is probably why I cant find any help online. It has stumped me and any help would be appreciated.

I have copied and pasted my code below in the hope that helps. Thanks in advance if you can offer any advice.

Code:
<script>
	  

function start() {
  GMToffset = 0;
  t=setInterval('digitalclock()',500);
}

function digitalclock()
{
var today=new Date();
var hours=today.getHours() + GMToffset;
var minutes=today.getMinutes();
var seconds=today.getSeconds();
minutes=checkTime(minutes);
seconds=checkTime(seconds);
hours=checkTime(hours);
document.getElementById('txt').innerHTML=hours+":"+minutes+":"+seconds;
}

function checkTime(i)
{
if (i<10)
  {
  i="0" + i;
  }
return i;
}

function updatetime1() {
  GMToffset = -3; 
}

function updatetime2() {
  GMToffset = -4; 
}

function updatetime3() {
  GMToffset = -7; 
}

function updatetime4() {
  GMToffset = -10; 
}

function updatetime5() {
  GMToffset = -11; 
}

function updatetime6() {
  GMToffset = -13; 
}

function updatetime7() {
  GMToffset = +9; 
}

function updatetime8() {
  GMToffset = +8; 
}

function updatetime9() {
  GMToffset = +7; 
}

function updatetime10() {
  GMToffset = +1; 
}

function updatetime11() {
  GMToffset = +0; 
}

function updatetime12() {
  GMToffset = +3; 
}

</script>

<div align="center">
<input type="button" onclick="updatetime1()" value="Time in Buenos Aires" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime2()" value="Time in New York" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime3()" value="Time in San Francisco" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /><br>
<input type="button" onclick="updatetime4()" value="Time in Hawaii" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime5()" value="Time in Fiji" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime6()" value="Time in Sydney" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /><br><br>

<body onload="start()">
<div id="txt"></div>

</div>

<div align="center">
<input type="button" onclick="updatetime7()" value="Time in Tokyo" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime8()" value="Time in Hong Kong" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime9()" value="Time in Bangkok" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" /><br>
<input type="button" onclick="updatetime10()" value="Time in Rome" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime11()" value="Time in London" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />
<input type="button" onclick="updatetime12()" value="Time in Moscow" style="color: #07c; font-family: Arial; font-size: 12px; height: 20px; width: 250px;" />


Full Excel VBA Course - Beginner to Expert

Similar Tutorials

Add 1 Hour To Drop Down Menu?
Hour Comparision Help (hopefully Quite Basic)
I Would Like My Current Pop Under Code To Work Once Per Hour
Time Of Day/week/hour Message Help
Wait Msg In Java Script(hour Glass)
Modifying Countdown Script To End At Specific Hour Instead Of Day
Javascript Drop Down Menu For Years Past And Future
Javascript Clock - Need Help
Help With A Javascript Clock I Made
Javascript Clock With A Tweak
How To Add Leading Zero To Hours In Javascript Clock
Help With Simple Flash Clock To Html Javascript
Javascript Official Time/internet Clock
Need Help With An Alarm Clock In Javascript With Mysql Background
Javascript Date Math - Date In Past Plus 14 Days?
How To Stop A Javascript
How To Stop Look In Javascript Slideshow
Javascript Stop Function
Help Please To Stop Javascript Slideshow
Stop Video Through Javascript


Learn VBA & Macros for Excel in 1 Week!


Add 1 Hour To Drop Down Menu?

 Similar Tutorials View Content
I have calendars on my site where tenants can make reservations for shared rooms. The start times are listed in a drop down starting at 8am and going through 5pm at one hour intervals. What I'd like to be able to do is make the drop down be populated 1 hour from the current time. For example, if it is 8 now, I'd like the time in the drop down to start at 9. Is this something that's possible or wishful thinking?

Hour Comparision Help (hopefully Quite Basic)

 Similar Tutorials View Content
Hi,
I have the following code which *should* change the image I have on my webpage to images based on the time.
Code:
function timeDate() {
  var t=new Date();
  var h = d.getHours();
  var r1="images/datetime/1.png";
  var r2="images/datetime/2.png";
  var r3="images/datetime/3.png";
  var r4="images/datetime/4.png";
  var r5="images/datetime/5.png";
  var r6="images/datetime/6.png";
  var r7="images/datetime/7.png";
  var r8="images/datetime/8.png";
  var r9="images/datetime/9.png";
  var r10="images/datetime/10.png";
  var r11="images/datetime/11.png";
  var r12="images/datetime/12.png";
  var r13="images/datetime/13.png";
  var r14="images/datetime/14.png";
  var r15="images/datetime/15.png";
  var r16="images/datetime/16.png";
  var r17="images/datetime/17.png";
  var r18="images/datetime/18.png";
  var r19="images/datetime/19.png";
  var r20="images/datetime/20.png";
  var r21="images/datetime/21.png";
  var r22="images/datetime/22.png";
  var r23="images/datetime/23.png";
  var r24="images/datetime/00.png";
  var el=document.getElementById('hours');

  el.src = (h == 1) r1;
  el.src = (h == 2) r2;
  el.src = (h == 3) r3;
  el.src = (h == 4) r4;
  el.src = (h == 5) r5;
  el.src = (h == 6) r6;
  el.src = (h == 7) r7;
  el.src = (h == 8) r8;
  el.src = (h == 9) r9;
  el.src = (h == 10) r10;
  el.src = (h == 11) r11;
  el.src = (h == 12) r12;
  el.src = (h == 13) r13;
  el.src = (h == 14) r14;
  el.src = (h == 15) r15;
  el.src = (h == 16) r16;
  el.src = (h == 17) r17;
  el.src = (h == 18) r18;
  el.src = (h == 19) r19;
  el.src = (h == 20) r20;
  el.src = (h == 21) r21;
  el.src = (h == 22) r22;
  el.src = (h == 23) r23;
  el.src = (h == 24) r24;
}

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() {
  timeDate();
});

I am a very new to JavaScript, and I don't know why this won't work. It should compare the hour variable (h) to the hour, and then change the image based on that. However it doesn't do this, and I'm not sure why. I've tried using both = and ==, but neither seem to work. Like I said I am a newbie to this sort of stuff.

Can anyone point me in the right direction to fixing this? Also, would there be a way of making the el.src to: "images/timedate/"+[the hour]+".png" without the need of directly comparing the hours? It would be useful if it was possible, as I need to do a minutes one as well

Thank you very much in advance

I Would Like My Current Pop Under Code To Work Once Per Hour

 Similar Tutorials View Content
Hi,my current pop under code works ever 24hrs,but I would like to change it to work every hour,and/or to work every time a member clears his cookies.If I am not explaining this correctly please let me know and I will try to correct this.




Code:
function setCookie(name, value, time)
   {
       var expires = new Date();
       
       expires.setTime( expires.getTime() + time );
       
       document.cookie = name + '=' + value + '; expires=' + expires.toGMTString();
   }




Any help with this would be greatly appreciated!!

Mike

Edit:If you need me to post the whole code I have no prob with this.I only posted this part because I thought the issue would be in var expires = new Date();. Just want to know what should I change it to? Here is the whole code.


Code:
<script type="text/javascript">
   var puShown = false;

   function doOpen(url)
   {
           if ( puShown == true )
           {
                   return true;
           }

           win = window.open(url, 'wmPu', 'toolbar,status,resizable,scrollbars,menubar,location,height=700,width=1100');
           if ( win )
           {
                   win.blur();
                   puShown = true;
           }
           return win;
   }
   
   
   function setCookie(name, value, time)
   {
       var expires = new Date();
       
       expires.setTime( expires.getTime() + time );
       
       document.cookie = name + '=' + value + '; expires=' + expires.toGMTString();
   }
   
   
   function getCookie(name) {
       var cookies = document.cookie.toString().split('; ');
       var cookie, c_name, c_value;
       
       for (var n=0; n<cookies.length; n++) {
           cookie  = cookies[n].split('=');
           c_name  = cookie[0];
           c_value = cookie[1];
           
           if ( c_name == name ) {
               return c_value;
           }
       }
       
       return null;
   }


   function initPu()
   {
           if ( document.attachEvent )
           {
                   document.attachEvent( 'onclick', checkTarget );
           }
           else if ( document.addEventListener )
           {
                   document.addEventListener( 'click', checkTarget, false );
           }
   }
   
   
   function checkTarget(e)
   {
       if ( !getCookie('popundr') ) {
           var e = e || window.event;
           var win = doOpen('My Site Name Here/');
           
           setCookie('popundr', 1, 24*60*60*1000);
       }
   }

   initPu();
</script>

I do know that most of you hate pop ups and pop unders,but this is not to annoy my users.I am just using this to promote another site that I own..Thanks again.

Time Of Day/week/hour Message Help

 Similar Tutorials View Content
Hi i have been looking everywhere and cant seem time to find anything matching,
what i need is a scheduled message on a website, basically stating days of the week and time and who is live on air. also people maybe on air at 17.30 so i have no idea on how to code this.

e.g

Monday 15th August 17:45 - On Air Now, Lee Mills

so it also refreshes every 1 minute

Thank you for your help.

Wait Msg In Java Script(hour Glass)

 Similar Tutorials View Content
I have been using a javascript code to display a "Please wait..." message on screen but it seems to work in some instances and not in others.
Please assist me with javascript code that works in all instances

Issue 1:-
it doesnt pops up with d wait msg ven v click on buttons..
the buttons are not submit buttons.. instead on clicking dat button it calls a fnformsubmit() userdfnd funtion..

Issue 2:--
even after d response cums the wait msg window doesnt close.. it hangs in d backgrnd..

The foll code is used in the footer.jsp file... Please assist...

<html>
<head>
<script type="text/javascript" src="/js/os/jquery-1.5.1.min.js" ></script>
<script type="text/javascript" src="/js/os/jquery-ui-1.8.14.custom.min.js"></script>
<link rel="stylesheet" type="text/css" media="all" href="/js/os/jquery-ui-1.8.14.custom.css">

<script type="text/javascript">

for (var i = 0; i < document.links.length; i++) {
var attrib = document.links[i];
if (attrib.addEventListener) {
attrib.addEventListener('click', attachModalDialog, false);
} else if (attrib.attachEvent) {
attrib.attachEvent('onclick', attachModalDialog);
}
}

function attachModalDialog(evt) {
//alert('for Click event.');

$(ModalDialog).dialog({
modal: 'true',
title: 'Please Wait...',
width: 400,
height: 300,
closeOnEscape: false
}).dialog('open');
return true;
}

</script>

</head>


<body>
<div id="ModalDialog" style="display:none;">
<pre>

Server side process is in-progress.
Please wait.....

</pre>
</div>

</body>

</html>

Modifying Countdown Script To End At Specific Hour Instead Of Day

 Similar Tutorials View Content
Hi everyone,

I have a countdown script I'd like to modify so that the countdown ends at a specific hour, and not on a particular day at midnight. I'm new to coding (Ruby), so still trying to get the hang of Javascript:

Code:
 
	var current="Expired"
	var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")
 
	function countdown(yr,m,d){
		theyear=yr;themonth=m;theday=d
		var today=new Date()
		var todayy=today.getYear()
		if (todayy < 1000)
		todayy+=1900
		var todaym=today.getMonth()
		var todayd=today.getDate()
		var todayh=today.getHours()
		var todaymin=today.getMinutes()
		var todaysec=today.getSeconds()
		var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec
		futurestring=montharray[m-1]+" "+d+", "+yr
		dd=Date.parse(futurestring)-Date.parse(todaystring)
		dday=Math.floor(dd/(60*60*1000*24)*1)
		dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1)
		dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1)
		dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1)
		if(dday==0&&dhour==0&&dmin==0&&dsec==1){
			document.getElementById('counter').style.display='none';
			document.getElementById('expired').style.display='block';
			return
		}
		else{
			document.getElementById('countdown_day').innerHTML=dday;
			document.getElementById('countdown_hour').innerHTML=dhour;
			document.getElementById('countdown_min').innerHTML=dmin;
			document.getElementById('countdown_sec').innerHTML=dsec;
			setTimeout("countdown(theyear,themonth,theday)",1000)
		}
	}
 
 
 
	//MODIFY THIS LINE: enter the count down date using the format year/month/day
        //e.g. countdown(2009, 03, 23);
	countdown(2011, 12, 24);

I've tried to play with it by changing the following in green:

Code:
	

function countdown(yr,m,d, h ){
		theyear=yr;themonth=m;theday=d; thehour=h 
.
.
.
setTimeout("countdown(theyear,themonth,theday, thehour )",1000)
.
.
countdown(2011, 12, 24,  10 )

But I don't seem to be getting anywhere.

Any tips or pointers to push me in the right direction is much appreciated.

Thanks!

Javascript Drop Down Menu For Years Past And Future

 Similar Tutorials View Content
I am trying to create a drop down menu for dates that starts with today's date, but allows people to choose 50 years into the past and 10 years into the future.

Here's what I have for the years:

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=UTF-8" />
<title>Untitled Document</title>
</head>

<body>
<h4>Select a date to see the energies for that day
<script type="text/javascript">
var mesparaluna=['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sept','Oct','Nov','Dec'];

function populatedropdown(mesparaluna, diaparaluna, axxa1){
var today=new Date()
var mesparaluna=document.getElementById(mesparaluna)
var diaparaluna=document.getElementById(diaparaluna)
var axxa1=document.getElementById(axxa1)
for (var i=0; i<31; i++)
diaparaluna.options[i]=new Option(i, i+1)
diaparaluna.options[today.getDate()]=new Option(today.getDate(), today.getDate(), true, true) //select today's day

for (var m=0; m<12; m++)
mesparaluna.options[m]=new Option(mesparaluna[m], mesparaluna[m]+1)
mesparaluna.options[today.getMonth()]=new Option(today.getMonth(), today.getMonth(), true, true) //select today's month

var thisyear=today.getFullYear()

for (var y=0; y<20; y++){
axxa1.options[y]=new Option(thisyear, thisyear)
thisyear+=1
}
axxa1.options[0]=new Option(today.getFullYear(), today.getFullYear(), true, true) //select today's year
}

</script>
<script>
sacakindias()
</script>

<SCRIPT SRC=tzolkin.js></script>

<script>
armatzolkin()
</script>

<p><font size="2" face="Verdana">
<SELECT class="input_tex" name=mesparaluna id="mesparaluna"></SELECT>  &nbsp;</font>
<SELECT class="input_tex" name="diaparaluna" id="diaparaluna"></SELECT>&nbsp;&nbsp;</font>
<SELECT class="input_tex" name="axxa1" id="axxa1"></SELECT></p>

<p><INPUT class="input_tex"  onclick="sacakinpersonal()" type="button" value="Search"><img border="0" name="pirav" src="blanco.gif" class="shakeimage" width="10" height="10"> 
<INPUT class="input_tex"  onclick="sacakindias()" type="button" value="Today"></p></form>
<script type="text/javascript">

//populatedropdown(id_of_day_select, id_of_month_select, id_of_year_select)
window.onload=function(){
populatedropdown("diaparaluna", "mesparaluna", "axxa1")
}
</script>
</h4>
</body>
</html>

I am also having a problem with the month. I wanted it to show the name of the month, but I am getting a number (and a wrong one at that).

Apologies... I am a terrible newbie with Javascript.

Javascript Clock - Need Help

 Similar Tutorials View Content
Javascript for clock:

Code:
 function showTime (dateObj) {
	thissecond=dateObj.getSeconds();
	thisMinute=dateObj.getMinutes();
	thisHour=dateObj.getHours();
	
	// change thisHour from 24-hour time to 12-hour time by:
	// 1) if thisHour < 12 then set ampm to "a.m." otherwise set it to "p.m."
	var ampm = (thisHour < 12) ? "a.m." : "p.m.";
	
	// 2) subtract 12 from the thisHour variable
	thisHour = (thisHour > 12) ? thisHour - 12 : thisHour;
	
	// 3) if thisHour equals 0, change it to 12
	thisHour = (thisHour == 0) ? 12 : thisHour;
	
	// add leading zeros to minutes and seconds less than 10
	thisMinute = thisMinute < 10 ? "0"+thisMinute : thisMinute;
	thisSecond = thisSecond < 10 ? "0"+thisSecond : thisSecond;
	
	return thisHour + ":" + thisMinute + ":" + thisSecond + ampm;
}

HTML for page:

Code:
 <?xml version="1.0" encoding="UTF-8" ?>

<!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">
<!-- 
   New Perspectives on JavaScript, 2nd Edition
   Tutorial 3
   Tutorial Case

   The Chamberlain Civic Center
   Author: 
   Date:  

   Filename:         ccc.htm
   Supporting files: back.jpg, calendar.css, calendar.js, ccc.css, ccc.jpg, logo.gif
-->
   <title>The Chamberlain Civic Center</title>
   <link href="ccc.css" rel="stylesheet" type="text/css" />

	
   <link href="calendar.css" rel="stylesheet" type="text/css" />
	
   <script src="calendar.js" type="text/javascript"></script>

</head>

<body>
   <div id="head">
	
   	<script type="text/javascript">
		
   			calendar("March 25, 2011");
	
   	</script>
      <img src="ccc.jpg" alt="Chamberlain Civic Center" />
   </div>

   <div id="links">
      <table><tr>
      <td><a href="#">Home</a></td><td><a href="#">Tickets</a></td>
      <td><a href="#">Events</a></td><td><a href="#">Tour</a></td>
      <td><a href="#">Directions</a></td><td><a href="#">Hours</a></td>
      <td><a href="#">Packages</a></td><td><a href="#">Contact Us</a></td>
      </tr></table>
   </div>

   <div id="main">
      <p id="firstp"><img src="photo.jpg" alt="" />March is another banner month 
      at the Chamberlain Civic Center, with performances of the award-winning 
      musical, <span>The Producers</span> by the Broadway Touring Company on
      March 4, 5, and 6. Tickets are going fast, so order yours today.</p>

     <p>Celebrate the season on March 11 with the Chamberlain Symphony and their 
        special selection of classical music with Spring themes. The next day, 
        March 12, exercise your mind by attending the Charles Dickens mystery 
        <span>Edwin Drood</span>.</p>

     <p>Jazz lovers have a lot to celebrate in March with a visit from <span>The 
        Jazz Masters</span> on the 17th. Then on March 24, enjoy the music of The 
        Duke with <span>An Ellington Tribute</span> performed by the Jazz Company 
        of Kansas City.</p>

     <p>Pins, bottles, plates, and chairs are flying at the Chamberlain Civic 
        Center in March. <span>The Taiwan Acrobats</span> return with another 
        amazing performance on Sunday, March 13. On March 20, the <span>Madtown 
        Jugglers</span> get into the act with their unique blend of comedy, juggling, 
        and madness.</p>

     <p>Enjoy a classical brunch every Sunday afternoon with music provided by the 
        Carson Quartet. Seating is limited, so please reserve your table.</p>
   </div>

   <address>
      The Chamberlain Civic Center &nbsp;·&nbsp;
      2011 Canyon Drive &nbsp;·&nbsp;
      Chamberlain, SD 57325 &nbsp;·&nbsp;
      (800) 555-8741
   </address>

</body>
</html>

CSS for page:

Code:
 /*
   New Perspectives on JavaScript, 2nd Edition
   Tutorial 3
   Tutorial Case
   Filename: ccc.css

   This file contains styles used in the ccc.htm file
*/

body {margin: 0px; background: white url(back.jpg) repeat-y scroll 820px 0px}
#head {width: 750px; height: 150px; padding: 5px}

#links {clear: right; width: 750px; padding: 0px}
#links table {width: 750px; font-family: Arial, Helvetica, sans-serif;
              font-size: 8pt; margin: 0px}
#links table td {text-align: center; background-color: white;
                 border: 1px solid black; letter-spacing: 5; padding: 2px}
#links table a {text-decoration: none; color: rgb(223,29,29); width: 100%}
#links table a:hover {color: white; background-color: rgb(223,29,29)}

#main {width: 750px; font-family: Arial, Helvetica, sans-serif; padding: 10px}
#main p {text-align: justify; font-size: 9pt}
#firstp:first-line {font-variant: small-caps}
#main img {float: right; margin: 0px 0px 10px 10px}

#main p span {color: rgb(223,29,29)}

address {width: 750px; font-size: 8pt; font-style: normal; color: rgb(223,29,29);
         font-family: Arial, Helvetica, sans-serif; text-align: center;
         border-top: 1px solid rgb(223,29,29); padding-bottom: 10px}



Does anyone know how to put my clock into my HTM and CSS files to have it appear at the top left of the page? Please, help. Thanks.

Help With A Javascript Clock I Made

 Similar Tutorials View Content
I am pretty new to javascript and descided to test my skills by making a javascript clock using the computers time

it works but I know the way I am doing it isn't very good
you can see the code below
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>
    <title>clock</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript">
	  var minutes = 0;
	  var seconds;
	  var hour = 0;
	  var minute = new Date().getMinutes();
	  minutes += minute;
	  var hours = new Date().getHours();
	  hour += hours;
          var time_period = "";
	  if(hour > 12){
		hour = hour-12;
                time_period = "PM";
	  }else {
            time_period = "AM";
          }
      function working_clock(){
		var time = new Date;
	    seconds = time.getSeconds();
		var clock = document.getElementById('clock');
	    if(seconds == 59){
          minutes+=1;
        }
	    if(minutes == 60){
          minutes = 1;
          hour++; 
        }
          if(minutes < 10){
            var minute_digit_two = 0;
            clock.innerHTML = ("time: "+hour+":"+minute_digit_two +minutes+":"+seconds+" "+time_period);
          }else {
            clock.innerHTML = ("time: "+hour+":"+minutes+":"+seconds+" "+time_period);
          }
	  setTimeout("working_clock()",1000);
      }
       window.onload = working_clock;
    </script>
  </head>
  <body>
    <div id="clock"></div>
  </body>
</html>

heres where you can see it in action
http://the-test.comoj.com/files/working-clock.html

im just asking if there are any errors or if theres a better way to do this

Javascript Clock With A Tweak

 Similar Tutorials View Content
Hello everybody.

I need to make a javascript (and only javascript, no php and such) clock, that the hours and the minuets can be updated manually by an html form with 2 fields.

I cant find a way to do this.

thanks in advance,
danbb.

How To Add Leading Zero To Hours In Javascript Clock

 Similar Tutorials View Content

Help With Simple Flash Clock To Html Javascript

 Similar Tutorials View Content
I'm trying to convert A world Population Counter from Flash into HTML/Javascript.

But I'm having difficulties and It would be great if someone can help me out.

The sample show a analog clock, But the html version I want should use just a digital clock, it's simpler I think
http://www.webstylelabs.com/worldclock2.swf
http://www.webstylelabs.com/actionscript.txt

Here is my code,
http://www.webstylelabs.com/clock.html
So just plain input digital counter is ok

I appreciate any help

Javascript Official Time/internet Clock

 Similar Tutorials View Content
hello all, this is my first time on this site and i can usally find all the information i need on google. However iv run into a problem while coding a countdown timer for students in my school i will be hosting it as a mobile website. what im having problems with is getting not the system time, but 1 syncronized time source ex. The official U.S.time or any other single time source if that one will not be the best. any suggestions?

ps. i am completely new to js so make any suggestions and please explain throughly.

Thanks!

Need Help With An Alarm Clock In Javascript With Mysql Background

 Similar Tutorials View Content
Thanks for clicking on the link and i presume while you are here on my thread yo u will try to help me
So here is the situation. I am building webpage that displays a clock , a ticker box and a countdown(alarm clock). I have found many previously coded alarm clocks/countdown timers but they dont do what i need. Then what do you need you might be asking yourself?! - I need a countdown timer with background in MySQL database(there will be multiple events in that database) and then checks which is the next one( Alarms will be in HH:MM format so they can be activated every day), after the check it displays a countdown(logical eh?) until that event - when it reaches that event it should redirect to some other site(which will return user to the same site after 15 min pause) and then All over again, check which is next, countdown , redirect , AGAIN
This website is designed not to be clicked or anything - it should work by itself.
Are YOU able to help me? (Just a fair warning - Im a newb in javascript so dont be too harsh on me)

Javascript Date Math - Date In Past Plus 14 Days?

 Similar Tutorials View Content
Not sure if this is possible in javascript:

I'm looking for two different dates (bill date and due date) on an invoice that are captured by OCR. If one of them exists, but the other does not, I want the empty field to be 14 days before (or after) the other.

For example:
if the bill date is 7/27/2010 and the due date was not captured, I want to set the due date as 8/10/2010 (14 days after the bill date).

If the due date was captured as 8/10/2010, but the due date is blank, I want to assign the bill date as 7/27/2010 (14 days before the due date).

if both dates have values, do nothing.

Thanks.

How To Stop A Javascript

 Similar Tutorials View Content
Hi Guys,

Quick question, is there a way to stop a JavaScript from validating after a certain point of the code. I've been "googling" like crazy and cant find a solution.

I had to add a Checkbox validation last second and there was existing validation and I'm not good enough to alter all of it to reflect the checkbox part so what I did was I checked to see if at least one of the checkboxes was selected, if yes, do nothing and finish the rest of the validation. If no, prompt them with an error.

The problem is after it prompts them for an error, it continues to run the rest of the validation and at the end it allows the end user to print. I cannot allow the end user to print until everything is filled in. Here is my code:

Code:
function validateFields() {
	var fieldsToVerify = [
                ["PrincipalInvestigator"], 
		["ContactEmailAddress"],
		["RFAward"],
		["Sponsor"],
		["AwardTitle"], 
		["BudgetStartDate"], 
		["BudgetEndDate"], 
		["SectionII"],
		["ProjectRole"],
		["EmployeeName"], 
		["DatesofAppointment"],
		["EffortonProject"],
		["Date"],
		["PrintName"],
		["Date2"],
		["PrintName2"],
		
	];
	

		var emptyFields = [];
	var notFullFields = [];
	for (var i=0; i<fieldsToVerify.length; i++) {
		var f = this.getField(fieldsToVerify[i][0]);
		if (f==null) {
			console.println(fieldsToVerify[i][0] + " not found.");
			continue;
		}
		if (f.valueAsString=="") {
			emptyFields.push(f.name);
		} else if (fieldsToVerify[i].length>1 && f.valueAsString.length<fieldsToVerify[i][1]) {
			notFullFields.push([f.name,fieldsToVerify[i][1]]);
		}
	}
	
	for (var i in nonRequiredFieldsToVerify) {
		var f = this.getField(nonRequiredFieldsToVerify[i]);
		if (f==null) {
			console.println(nonRequiredFieldsToVerify[i] + " not found.");
			continue;
		}
		if (f.valueAsString!="" && f.valueAsString.length<f.charLimit) {
			notFullFields.push([f.name,f.charLimit]);
		}
	}


 if 
(this.getField("CheckBox1").value=="Yes" || this.getField("CheckBox2").value=="Yes" || this.getField("CheckBox3").value=="Yes" || this.getField("CheckBox4").value=="Yes" || this.getField("CheckBox5").value=="Yes" || this.getField("CheckBox6").value=="Yes" || this.getField("CheckBox7").value=="Yes")

{}

else

app.alert("Select a Checkbox in Section I before printing") 

	if (emptyFields.length==0 && notFullFields.length==0) {
		this.print();
	} else {
		var msg = "";
		if (emptyFields.length>0) {
			msg += "The following fields must be filled-in:\n";
			for (var i in emptyFields)
				msg += emptyFields[i]+"\n";
		}

		if (notFullFields.length>0) {
			if (msg!="") msg+="\n\n";
			msg += "The following fields are not filled-in completely:\n";
			for (var i in notFullFields)
				msg += notFullFields[i][0] + " (required length: " + notFullFields[i][1] + ")\n";
		}
		app.alert(msg,"");
	}
}


How To Stop Look In Javascript Slideshow

 Similar Tutorials View Content
I am very new to Javascript - as in this is the first day I'm using it. I am using a code I got offline to fade three pictures together, but when it gets to the last image, it loops back to the first.

How do I code it so that when it gets to the last image, it stops?
Here is the code - sorry if its messy.

Javascript:

/*****

Image Cross Fade Redux
Version 1.0
Last revision: 02.15.2006
steve@slayeroffice.com

Please leave this notice intact.

Rewrite of old code found he http://slayeroffice.com/code/imageCrossFade/index.html


*****/


window.addEventListener?window.addEventListener("load",so_init,false):window.attachEvent("onload",so _init);

var d=document, imgs = new Array(), zInterval = null, current=0, pause=false;

function so_init() {
if(!d.getElementById || !d.createElement)return;

// DON'T FORGET TO GRAB THIS FILE AND PLACE IT ON YOUR SERVER IN THE SAME DIRECTORY AS THE JAVASCRIPT!
// http://slayeroffice.com/code/imageCrossFade/xfade2.css
css = d.createElement("link");
css.setAttribute("href","xfade2.css");
css.setAttribute("rel","stylesheet");
css.setAttribute("type","text/css");
d.getElementsByTagName("head")[0].appendChild(css);

imgs = d.getElementById("imageContainer").getElementsByTagName("img");
for(i=1;i<imgs.length;i++) imgs[i].xOpacity = 0;
imgs[0].style.display = "block";
imgs[0].xOpacity = .99;

setTimeout(so_xfade,3000);
}

function so_xfade() {
cOpacity = imgs[current].xOpacity;
nIndex = imgs[current+1]?current+1:0;

nOpacity = imgs[nIndex].xOpacity;

cOpacity-=.05;
nOpacity+=.05;

imgs[nIndex].style.display = "block";
imgs[current].xOpacity = cOpacity;
imgs[nIndex].xOpacity = nOpacity;

setOpacity(imgs[current]);
setOpacity(imgs[nIndex]);

if(cOpacity<=0) {
imgs[current].style.display = "none";
current = nIndex;
setTimeout(so_xfade,3000);
} else {
setTimeout(so_xfade,50);
}

function setOpacity(obj) {
if(obj.xOpacity>.99) {
obj.xOpacity = .99;
return;
}

obj.style.opacity = obj.xOpacity;
obj.style.MozOpacity = obj.xOpacity;
obj.style.filter = "alpha(opacity=" + (obj.xOpacity*100) + ")";
}

}




HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<div class="container">

<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta http-equiv="imagetoolbar" content="false" />
<link rel="stylesheet" href="style.css" type="text/css" />
<script type="text/javascript" src="slideshow.js"></script>
<title>Diamonds in the Rough</title>
</head>

<body>

<div id="container">
<img src="images/top2.jpg" usemap="#Map2"/>
<map name="Map2" id="Map2">
<area shape="rect" coords="69,56,145,84" href="invite.html" rel="nofollow" target="_self" alt="The Gala" />
<area shape="rect" coords="171,53,356,87" href="diamonds.html" rel="nofollow" target="_self" alt="Diamonds in the Rough" />
<area shape="rect" coords="377,52,498,87" href="mariama.html" rel="nofollow" target="_self" alt="Speaker Mariama Elliot" />
<area shape="rect" coords="525,52,636,86" href="contact.html" rel="nofollow" target="_self" alt="Get Involved" />
</map>

<div id="imageContainer">
<img src="images/index.jpg"/>
<img src="images/index2.jpg"/>
<img src="images/invite.jpg"/>

</div>



<div id="container2">
<img src="images/BOTTOM.jpg"/>
</div>


</body>
</html>



Thanks for your help!

Javascript Stop Function

 Similar Tutorials View Content
Hi all.
I have this simple javascript that initiates a flash player.
Code:
	<script type="text/javascript">
	function add_content(filedesc,filepath,whatarget) 
{
    
	var output = "" + filedesc + "</b><br />";
	output += "<object type='application/x-shockwave-flash' data='mp3player.swf'>";
    	output += "<param name='movie' value='mp3player.swf'>";
	output += "<param name='wmode' value='transparent'>";
    	output += "<param name='FlashVars' value='mp3=" + filepath + ">";
    	output += "</object></div>";
		output += "" + whatarget + "";
document.getElementById("" + whatarget + "").innerHTML = output;
}
</script>

and this takes care of the onclick event:
Code:
<a href="javascript:void;" onclick="javascript:add_content('Hello1','../m_music/omd.mp3','target1');">Omd</a><div id='target1'></div>
<a href="javascript:void;" onclick="javascript:add_content('Hello2','../m_music/blondie.mp3','target2');">blondie</a> <div id='target2'></div>

page and vars are going to be dynamic. My question is: if I press 'target1' it plays. When I press 'target2' second player plays in its div layer. How can I start one player while stopping another (I am guessing 'target1' must be hidden). I am going to have many mp3 files and I want each player to be in its rightful place. I've looked for functions, but I am not that experienced with JV syntax. Thank you.

Help Please To Stop Javascript Slideshow

 Similar Tutorials View Content
Thanks to Old Pedant , in this forum, I am using this basic code for a slideshow he posted:

Code:
var slides = [
    [ "abc.jpg", 3000 ],
    [ "xyz.png", 5000 ],
    [ "foo.gif", 1500 ]
];
var curSlide = 0;

function nextSlide( )
{
    document.getElementById("thePicture").src = slides[curSlide][0].src;
    setTimeout( nextSlide, slides[curSlide][1] );
    curSlide = ( curSlide + 1 ) % slides.length;
}

function setUp( )
{
    for ( var s = 0; s < slides.length; ++s )
    {
        var image = new Image();
        image.src = slides[s];
        slides[s] = image;
    }
    nextSlide( );
}

window.onload = setUp;

which works just fine. But I can't find a way for it to play one round of the slides then stop. Could someone please help me with the right bit of code to stop the show?

I know the code is a bit basic (no fades etc) but I have been unable to find a similar slideshow product that gives variable time delays for each slide. I've googled endlessly but nothing could i find....

TIA

Richard
=========

Stop Video Through Javascript

 Similar Tutorials View Content
I am using joomla, and have a tabbed menu at the top, which has different articles embedded within. I have embedded a flash video inside each article. The problem is that if i play a video and then switch to the other tab (article) without pausing the video, the video keeps on playing. And if i try to play the video in the other article, then both videos start playing.

I want to stop the first video from playing as soon as I switch to the new tab. There are a lot of different files which are included in the page, so If I know where to place a particular code within the source of the final rendered webpage, I will be able to place it at the right point in a particular file.

thanks

the website link is: http://tinyurl.com/ycg4tcm
Privacy