|
|
Digitális óra.
Mobilváltozat!
Asztali változathoz,
kattints a képre!
Ha a javascript programot azon html - fájlban helyezzük el, hól az órát megakarjuk jeleníteni, és nem külön jávascrip fájlban, melynek kiterjesztése ( js ).
Az óra indítási utasítását, a kezdő body címkében helyezzük el:
<body onLoad="startclock()">
Ha külön jávascript - fájlban írjuk meg, akkor az ott lévő programban kell elhelyezni az óra indítására vonatkozó utasítást:
// óra indítása, az oldal betöltésekor
window.onload = startclock;
HTML megírása.
<link href="Css-fájl-neve.css"
rel="stylesheet"
type="text/css" />
<head>
<body>
<FORM name="clock"
class="clock">
<script language="JavaScript"
type="text/javascript"
src="java-fájl-neve.js">
</script>
<table class="tabla">
<tr>
<td>
<input type="text"
name="digiora"
size="11"
class="digiora"
value="">
</td>
</tr>
</table>
</FORM>
</body>
</html>
A class="digiora" azonositóval:
- Css, azaz stíluslapon határozzuk meg az óra számainak méretét.
- A szöveg méretével arányosan változik az ablak mérete
- A szöveg stílusát és méretét, feltétlen adjuk meg, Explorer - Mozilla összhang végett.
- Az óra keretében megjelenő számokat: balra, középre vagy jobbra helyezhetjük.
Javascript megírása.
var timeID = null;
var timeRunning = false;
function stopclock ()
{
if(timerRuning)
clearTimeout(timerID);
timerRunning = false;
}
function showtime ( )
{
var now = new Date( );
var hours = now . getHours( );
var minutes = now . getMinutes( );
var seconds = now . getSeconds( )
var timeValue = " " + ((hours >24) ? hours -24 :hours)
timeValue = ((timeValue <10)? " 0 " : " ") + timeValue
timeValue += ((minutes < 10) ? ":0" : ":") + minutes
timeValue += ((seconds < 10) ? ":0" : ":") + seconds
timeValue += (hours >= 24) ? " pm" : " am"
document.clock.digiora.value = timeValue;
timerID = setTimeout("showtime( )",100);
timerRunning = true;
}
function startclock()
{
stoplock();
showtime();
}
// óra indítása, az oldal betöltésekor
window.onload = startclock;
További és részletesebb tájékoztatót, lásd az asztali változatnál!