1. Inserir na diretiva <HEAD> </HEAD>:
<SCRIPT LANGUAGE="JavaScript">
// Função para pegar a data-->
function gettheDate() {
Todays = new Date();
TheDate = " " + Todays.getDate() +" / "+ (Todays.getMonth() + 1) + " / " +
Todays.getYear()
document.clock.date.value = TheDate;
}
var timerID = null;
var timerRunning = false;
// Final da Função -->
function stopclock (){
if(timerRunning);
clearTimeout(timerID);
timerRunning = false;
}
// - - - - - - - - Inicializa o Clock-->
function startclock () {
stopclock();
gettheDate()
showtime();
}
// - - - - - - - - Mostra a Hora-->
function showtime () {
var now = new Date();
var hours = now.getHours();
var minutes = now.getMinutes();
var seconds = now.getSeconds()
var timeValue = "" + ((hours >12) ? hours -12 :hours)
timeValue += ((minutes < 10) ? ":0" : ":") + minutes
timeValue += ((seconds < 10) ? ":0" : ":") + seconds
timeValue += (hours >= 12) ? " P.M." : " A.M."
document.clock.face.value = timeValue;
// you could replace the above with this
// and have a clock on the status bar:
// window.status = timeValue;
timerID = setTimeout("showtime()",1000);
timerRunning = true;
}
// - - - - - - - - Final do código JavaScript --->
</SCRIPT>
2. Incluir no inicio da diretiva <BODY> </BODY>:
<BODY BGCOLOR="#FFFFFF" onLoad="startclock()">
3. Criar um formulário na diretiva <BODY> </BODY>:
<form name="clock" onSubmit="0"> Data: <BR> <input type=text name="date" size=12 value=""> <BR> <BR>Este efeito (Hora ou Data) pode também ser na forma de um botão ! <BR> <BR> Hora: <BR><input type=button name="face" size=12 value="JavaScript!!"> </form>