HTML - Clock Not In Javascript
I want a clock that updates by the minute that isn't analog for my website. Most of what I see are updating by the second, or are ASCII clocks. I just want something small and simple. I don't want to use JS because I think it's sort of messy and I prefer to stick with what I know, anyway (and I don't know a lot of JS-just enough to get by, really). I've seen clocks that weren't javascript, does anyone know of a code that I could use or could point me in the right direction?
Similar TutorialsCan you please give me a sample code to show a digital clock which will refresh every second. We should have a select box :- 1)24 hour cycle 2)12 hour cycle and we should display the clock accordingly. It should also tell "AM / PM". Hey, Newbie to the forums here... Im searching for a HTML or CSS Count-up Clock That can display the following ex. 1 year 45 days Since My 25th Birthday I no there are tons of java scripts that can do that but the page im looking into using it on does not except java Hello, I need a countdown clock thats big and counts down for 14 minutes and 43 sec and then resets itself, is it possible? It's for www.keepmyteenalive.org any other website suggestion are welcome, as it is my first website. thank you I am looking for HTML code that I can cut and paste for a countdown clock. I wanted to display a countdown from the 2009 NFL Draft which is 4/25/2009 at 3 PM Eastern time. If anyone has any suggestions on where to find this that would be great. ok I dont know what Im doing and Ive been trying find out how to get this thing to work Im new at this I know it is something simple but my eyes are getting tired Ive been at it for day I just dont get it I hope it gets easier soon HTML Code: <!-- START OF SCRIPT --><!-- HOW TO INSTALL DIGITAL COUNTDOWN: 1. Copy code into the HEAD section of document 2. Add the onLoad event handler into the BODY tag 3. Put last coding into the BODY section of document --><!-- STEP ONE: Add code into HEAD section of document --> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta content="Evrsoft First Page" name="GENERATOR"> <script language="JavaScript" type="text/javascript"> <!-- Begin //Created by DendE PhisH function getTime() { c1 = new Image(); c1.src = "1c.gif"; c2 = new Image(); c2.src = "2c.gif"; c3 = new Image(); c3.src = "3c.gif"; c4 = new Image(); c4.src = "4c.gif"; c5 = new Image(); c5.src = "5c.gif"; c6 = new Image(); c6.src = "6c.gif"; c7 = new Image(); c7.src = "7c.gif"; c8 = new Image(); c8.src = "8c.gif"; c9 = new Image(); c9.src = "9c.gif"; c0 = new Image(); c0.src = "0c.gif"; Cc = new Image(); Cc.src = "Cc.gif"; now = new Date(); //ENTER BELOW THE DATE YOU WISH TO COUNTDOWN TO later = new Date("Dec 25 2006 0:00:01"); days = (later - now) / 1000 / 60 / 60 / 24; daysRound = Math.floor(days); hours = (later - now) / 1000 / 60 / 60 - (24 * daysRound); hoursRound = Math.floor(hours); minutes = (later - now) / 1000 /60 - (24 * 60 * daysRound) - (60 * hoursRound); minutesRound = Math.floor(minutes); seconds = (later - now) / 1000 - (24 * 60 * 60 * daysRound) - (60 * 60 * hoursRound) - (60 * minutesRound); secondsRound = Math.round(seconds); if (secondsRound <= 01) { document.images.g.src = c0.src; document.images.h.src = eval("c"+secondsRound+".src"); } else { document.images.g.src = eval("c"+Math.floor(secondsRound/10)+".src"); document.images.h.src = eval("c"+(secondsRound%10)+".src"); } if (minutesRound <= 24) { document.images.d.src = c0.src; document.images.e.src = eval("c"+minutesRound+".src"); } else { document.images.d.src = eval("c"+Math.floor(minutesRound/10)+".src"); document.images.e.src = eval("c"+(minutesRound%10)+".src"); } if (hoursRound <= 9) { document.images.y.src = c0.src; document.images.z.src = eval("c"+hoursRound+".src"); } else { document.images.y.src = eval("c"+Math.floor(hoursRound/10)+".src"); document.images.z.src = eval("c"+(hoursRound%10)+".src"); } if (daysRound <= 9) { document.images.x.src = c0.src; document.images.a.src = c0.src; document.images.b.src = eval("c"+daysRound+".src"); } if (daysRound <= 99) { document.images.x.src = c0.src; document.images.a.src = eval("c"+Math.floor((daysRound/10)%10)+".src"); document.images.b.src = eval("c"+Math.floor(daysRound%10)+".src"); } if (daysRound <= 999){ document.images.x.src = eval("c"+Math.floor(daysRound/100)+".src"); document.images.a.src = eval("c"+Math.floor((daysRound/10)%10)+".src"); document.images.b.src = eval("c"+Math.floor(daysRound%10)+".src"); } newtime = window.setTimeout("getTime();", 1000); } // End --> </script><!-- STEP TWO: Insert the onLoad event handler into your BODY tag --> <title></title> <style type="text/css"> div.c1 {text-align: center} </style> </head> <body onload="getTime()"> <!-- STEP THREE: Copy code into BODY section of document --> <div class="c1"> <h3>Countdown to Christmas (2006)</h3> </div> <div class="c1"> <table> <tbody> <tr> <td valign="bottom" bgcolor="black"><img height="21" src="0c.gif" width="16" name="x" id="x"> <img height="21" src="0c.gif" width="16" name="a" id="a"> <img height="21" src="0c.gif" width= "16" name="b" id="b"> <img height="21" src="Cc.gif" width="9" name="c" id="c"> <img height="21" src="0c.gif" width="16" name="y" id="y"> <img height="21" src="0c.gif" width="16" name="z" id="z"> <img height="21" src="Cc.gif" width="9" name="cz" id="cz"> <img height="21" src="0c.gif" width="16" name="d" id="d"> <img height="21" src="0c.gif" width="16" name="e" id="e"> <img height="21" src="Cc.gif" width="9" name="f" id="f"> <img height="21" src="0c.gif" width="16" name="g" id="g"> <img height="21" src="0c.gif" width="16" name="h" id="h"></td> </tr> </tbody> </table> </div> <div class="c1"> <h4>(Days : Hours : Minutes : Seconds)</h4> </div><!-- END OF SCRIPT --> </body> </html> I want to put a simple live clock on my page, but many useful tags are restricted by the host (mocpages.com). MOCpages' documentation on disallowed HTML: http://mocpages.com/help/disallowed_html.php The restricted tags that I know of are <style>, <script>,<object>, <embed>, and <iframe> My URL, http://mocpages.com/home.php/1516, suggests that php may be acceptable as long as it doesn't use the restricted tags. The only other way I know of is to use the <img> tag with a server hosted clock. I have searched the internet and can't find one. If it helps, I can get away with inline css styles, since it isn't the <style> tag. Any other ideas? Anyone know a server hosted clock? Hi there, Does anyone know of a download for the countdown olympic clock 2012 that is available in html format. All the ones, I've seen uses Flash, whcih our website does not support. TIA I am currently working on a currency converter for my D&D website and have run into a bit of a problem. The basic idea is to select the appropriate currency you have from a row of radio buttons, insert the amount you have in a text area and in the next text area it will kick out a list of different currencies and the amount you will have in those currencies. My problem is that my JAVA skills are extremely poor. I figured out how to set up most of it but I cannot figure out how to grab the input and plug it into my formulas. Can anyone help me with this? Here is a link to the page: Currency Converter Any and all hope is greatly appreciated. Thanks. Take care and have a great day.... ciao, john., Here is the basic code without the web page info: Code: <script type = "text/javascript"> function radio_map(prefix) { var coins; // The type of coin selected // Go through all options to find the one that was selected for (cnt = 0; cnt < prefix.cointype.length; cnt++) { // If the coin was selected, checked will be true if (prefix.cointype[cnt].checked) coins = cnt; // Save that coin number } switch (coins) { // Copper case 0: prefix.matharea.value = "\n" + 1 * 1 + " Copper Coins \n" + 1 * .1 + " Silver Coins \n" + 1 * .01 + " Gold Coins \n" + 1 * .005 + " Platinum Coins \n" + 1 * .0001 + " Mithril Coins \n"; break; // Silver case 1: prefix.matharea.value = "\n" + 1 * 10 + " Copper Coins \n" + 1 * 1 + " Silver Coins \n" + 1 * .1 + " Gold Coins \n" + 1 * .05 + " Platinum Coins \n" + 1 * .001 + " Mithril Coins \n"; break; // Gold case 2: prefix.matharea.value = "\n" + 1 * 100 + " Copper Coins \n" + 1 * 10 + " Silver Coins \n" + 1 * 1 + " Gold Coins \n" + 1 * .5 + " Platinum Coins \n" + 1 * .01 + " Mithril Coins \n"; break; // Platinum case 3: prefix.matharea.value = "\n" + 1 * 1000 + " Copper Coins \n" + 1 * 10 + " Silver Coins \n" + 1 * 5 + " Gold Coins \n" + 1 * 1 + " Platinum Coins \n" + 1 * .1 + " Mithril Coins \n"; break; // Mithil case 4: prefix.matharea.value = "\n" + 1 * 10000 + " Copper Coins \n" + 1 * 1000 + " Silver Coins \n" + 1 * 100 + " Gold Coins \n" + 1 * 5 + " Platinum Coins \n" + 1 * 1 + " Mithril Coins \n"; break; } } </script> <form name="frmRadio"> <p> Please choose your coin type.</p> <div onclick ='radio_map(document.frmRadio)'> <input type="radio" name="cointype" value="Evanston"> Copper <input type="radio" name="cointype" value="Arlington Hts."> Silver <input type="radio" name="cointype" value="Oakbrook"> Gold <input type="radio" name="cointype" value="Downers Grove"> Platinum <input type="radio" name="cointype" value="Vernon Hills"> Mithril </div> Please input the number of coins that you have: <textarea name="coinarea" rows=1 cols=35> </textarea> Here are your converted coin numbers: <textarea name="matharea" rows=10 cols=35> </textarea> </form> OK so I'm making an application and I've hit a snag with my Javascript. So I have a form and a list with some value, and under the list I have a button (not a submit) HTML 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>Untitled Document</title> <script type="text/javascript"> <!-- function popUp(URL,WIDTH,HEIGHT){ day = new Date(); id = day.getTime(); var user = document.getElementById('user').value; eval("page" + id + " = window.open(URL, '"+ id + "', 'toolbar=1,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width="+WIDTH+",height="+HEIGHT+",left = 362,top = 234');"); } </script> <style type="text/css"> form{ margin: 0px; } .menu{ width: 200px; } #mem_list{ width: 200px; } </style> </head> <body> <div id="mem_list"> <center> Online User Info </center> <form method="get" action="/antrix/index.php"> <select name="color" size="5" class="menu" id="user"> <option value="Marlo">Marlo level 70 Warrior</option> <option value="Dsadasd">Dsadasd level 1 Warlock</option> <option value="Dsadasdd">Dsadasdd level 1 Priest</option> <option value="Asdassg">Asdassg level 1 Rogue</option> </select> <center> <input type="button" value="user options" onclick="javascript:popUp('mailmod.php','800','200')"/> </center> </form> </div> </body> </html> OK so when someone clicks the user options button i want the popup to go to the url and have the selected name in the GET value of the url like: mailmod.php?user=marlo if Marlo was selected. anyone got any ideas? *EDIT* yeh just realised this was in the wrong section, sorry ^_^ For the website I'm working on i want to store the text someone enters in an imput box to be stored as a variable so i can have an alert that welcomes them to my site. any suggestions. this one isn't illegal. Hope this is the correct place for this question. What I want to do is have a webpage which asks a question, e.g. "What is your name?" and when the user enters a name, e.g. "Bob" a button pops up with "are you ready?" The user clicks that button and the page then tells the visitor: "Good morning, Bob; nice to see you" (or the button could be there from the beginning; it does not have to pop up) Just want this to learn how to do this and hope I can carry on from there. I am assuming I need a javascript to do this. So I want to make an image that has mouseover tables that pop up. This is what the code looks like now: Code: <html> <table> <tr><td><img src= "pic.bmp" usemap="#mapareas"/></td></tr> </table> <map NAME ='mapareas'> <script language='JavaScript' type='text/javascript'> function show(id) { document.getElementById(id).style.visibility='visible'; return true; } function hide(id) { document.getElementById(id).style.visibility='hidden'; return true; } </script> <area shape = "rect" coords="0,0,100,100" title="one" onmouseover='javascript:show('one') onmouseout='javascript:hide('one')> <area shape = "rect" coords= "150,0,250,100" title="two" onmouseover='javascript:show('two') onmouseout='javascript:hide('two')> <area shape = "rect" coords= "0,150,100,250" title="three" onmouseover='javascript:show('three') onmouseout='javascript:hide('three')> <area shape = "rect" coords= "150,150,250,250" title="four" onmouseover='javascript:show('four') onmouseout='javascript:hide('four')> <area shape = "default" title="The Rest"> </map> <table border=0 cellPadding=0 cellSpacing=1 id='one' style='position:absolute; left:10px; top:120px; background:lightGrey; visibility:hidden'> <tr><td>ONE</td></tr> </table> <table border=0 cellPadding=0 cellSpacing=1 id='two' style='position:absolute; left:10px; top:120px; background:lightGrey; visibility:hidden'> <tr><td>TWO</td></tr> </table> <table border=0 cellPadding=0 cellSpacing=1 id='three' style='position:absolute; left:10px; top:120px; background:lightGrey; visibility:hidden'> <tr><td>THREE</td></tr> </table> <table border=0 cellPadding=0 cellSpacing=1 id='four' style='position:absolute; left:10px; top:120px; background:lightGrey; visibility:hidden'> <tr><td>FOUR</td></tr> </table> </html> everything is ok when the page is first loaded, but when I try the mouseovers, firefox's error console gives me this message: "syntax error javascript:show(" and "syntax error javascript:hide(" Can someone help me figure out what is going wrong? Thanks Hello everyone, newbie to this forum humbly seeking help. I'll got a javascript working to display an alt image on hover and at the same time an image box appearing at another place on the page (describing the link). After preparing the linked page I discovered that the link doesn't work. When I add "a href" within the code which already only has a "href" in the javascript the complex image cutting becomes apparent with a pixel or so space between each of the cuts. I had alt images working nicely, now I find something is very much a miss. Here is the code which delivers the two alt images well but doesn't link to the target page. "<tr><td><div id="NavigationImage3" href="about_us.html" onMouseOver="F_roll('NavigationImage3',1)" onMouseOut="F_roll('NavigationImage3',0)"><img id="NavigationImage3" name="NavigationImage3" src="images/b2-3a.jpg" onLoad="F_loadRollover(this,'images/b2-3b.jpg')" alt="Sample Text" onMouseOver="swap(3, 'imgDefault')" onMouseOut="swap(0,'imgDefault')"></a></td></tr>" Be very grateful if someone can help. Cheers, Mal from Cessnock (Aus) Hi. I am making a java scipt code for my link's image to change on mouse over. Is there a way to detect if a user has Java instaled? (And if they dont, just be a link without the change) Thanks. Does anyone know how to get a .html file with javascript to work in a .tpl file? can somebody change this code so it work i don't understand why its not working its a router planner for google maps. if you type your adres in the text box he must plan a route HTML Code: <form name="thisform" action="" method="get" onsubmit="window.open('http://maps.google.nl/maps?saddr='+document.thisform.adres.value,'_self')('+&daddr=Gemeenteweg+180+7951+CT+Staphorst&hl=nl&sll=52.649594 ,6.217762&sspn=0.010467,0.033023&geocode=FQ8BIwMdQRhcACnxa5xBMHfIRzHmGEdWCkhZ2A3BFXpeIwMdIuBeAClXUCEANXPIRzE6f2uCVLYVUw&oq=gree&mra=ls&t=h&z=13');return false;"> <input name="adres" type="text" /> <input name="submit" type="submit" value="Zie route" /> </form> K so I'm making my brother an inventory website that leads to a digital order sheet. On the order sheet, it has a dropdown of the items he has in the database. It's supposed to show the quantity of what he has in stock, but here's the thing: In this database, there are two tables, called Dishes, and Cables. These two tables are assigned to 1 id, so that I can display them in <td id = 'quantity'/>. The problem is, it displays the Cables only, but I want it to be so that if I select one of the dishes, it selects the quantity for the dishes, and if I select one of the cables. Here's the code I have. Code: <html> <head> <script type="text/javascript" > var data = null; var data2 = null; function GETSTUFF(stuff) { var xmlhttp = new XMLHttpRequest(); xmlhttp.open('GET', stuff, false); xmlhttp.send(); return xmlhttp.responseText; } function buildList() { data = eval('('+ GETSTUFF('inventory_2.php') +')'); console.log(data); for (var i=0;i<data.length;i++) { document.getElementById('materials').innerHTML += '<option onclick="showQuantity(\''+ data[i]['Quantity'] +'\'">'+ data[i]['Supplier'] +'</option>'; } data2 = eval('('+ GETSTUFF('inventory_21.php') +')'); console.log(data2); for (var i2=0;i2<data2.length;i2++) { document.getElementById('materials').innerHTML += '<option onclick="showQuantity(\''+ data2[i2]['Quantity (Boxes)'] +'\'">'+data2[i2]['Type'] +'</option>'; } } function showQuantity() { var supplier = document.getElementById('materials').options[document.getElementById('materials').selectedIndex].value; var type = document.getElementById('materials').options[document.getElementById('materials').selectedIndex].value; var amount = 0; var amount2 = 0; for (var i=0;i<data.length;i++) { if (data[i]['Supplier'] == supplier) { amount = (data[i]['Quantity']); } } document.getElementById('quantity').innerHTML = 'Quantity : '+amount; for (var i2=0;i2<data2.length;i2++) { if (data2[i2]['Type'] == type) { amount2 = (data2[i2]['Quantity (Boxes)']); } } document.getElementById('quantity').innerHTML = 'Quantity (Boxes) : '+amount2; } </script> </head> <body onload="setTimeout('buildList()' ,100)"/> <center> <img src="images.jpg" width=125px height=125px/> <br> <font size="8" color="grey" face="purisa">Home </font> <font size="8" color="red" face="purisa"> Communications</font> <br> <font size="5" color="grey" face="purisa">Order </font> <font size="5" color="red" face="purisa"> Sheet</font> <br> <table border="3" width="100%"> <tr> <th>Material:</th> <th>Quantity in stock:</th> <th>Quantity needed:</th> </tr> <tr> <td> <select id="materials" name= "" onchange = "showQuantity()"> <option disabled>Select</option> </select> </td> <td id="quantity"> </td> <td> <form> <input type = "quantityNeeded" /> </form> </td> </tr> </table> <br> <input type = "button" value="Submit"/> </center> </body> </html> I know the if statement involves selectedIndex, but I can't figure it out. Please help. I want to have a similar feature that this page has http://dtlr.com/shoes/shoes.html only the part that has the 4 thumbnails of the cropped shoes and then the larger image of the shoe next to it. Is this possible to build with html or javascript or is advanced css or something else needed? thanks Hi everyone, I'm having this really weird problem with a form I'm using. I am creating a banner module which allows users to upload banner code via an html form, one of the fields is for the code itself wich may be html based eg.<img src="ectectect" /> or javascript like <script language="javascript" src="ad.aspx?pid=17987&bid=4939"></script> The problem is this when i put any form of javascript into the textarea even just <script></script> tags and post the form the content in the input containing the javascript is always empty. This is my form tag: Code: <form action="" method="post" name="update"> Any ideas why this is happening? |