Jam Digital Javascript


Waktu sangat penting dalam kehidupan ini begitu juga dengan sebuah web. bisa sebagai penunjuk waktu untuk user, ataupun nilai estetika. oleh karena itu banyak cara untuk membuat aplikasi yang menunjukan waktu saat ini. Bisa dengan menggunakan flash, bahkan bahasa pemrograman basis web sendiri sudah menyediakan fungsi untuk menampilkan waktu. bahasa pemrograman serverside seperti PHP biasanya menampilkan waktu yang ada di komputer server. jadi bisa saja waktu yang di tampilkan di halaman web itu berbeda dengan waktu yang ada di komputer client.

Salah satu solusinya adalah dengan bahasa pemrograman client side salah satunya adalah javascript. javascript akan menampilkan waktu sesuai dengan waktu yang ada di komputer client. Untuk mempersingkat waktu langsung saja kita ke script program nya.

CODING :

<html>
<head>
<title>JAM DIGITAL</title>
</head>
<body>

<span id=”tick2″ style=”font-size: 22px;”></span>
<script>
function show2(){

if (!document.all&&!document.getElementById)
return
thelement=document.getElementById? document.getElementById(“tick2″): document.all.tick2
var Digital=new Date()
var hours=Digital.getHours()
var minutes=Digital.getMinutes()
var seconds=Digital.getSeconds()
var dn=”PM”

if (hours<12)
dn=”AM”

if (hours>12)
hours=hours-12

if (hours==0)
hours=12

if (minutes<=9)
minutes=”0″+minutes

if (seconds<=9)
seconds=”0″+seconds

var ctime=hours+”:”+minutes+”:”+seconds+” “+dn
thelement.innerHTML=””+ctime+””
setTimeout(“show2()”,1000)
}

window.onload=show2
</script>

</body>
</html>


Langkah-langkahnya :

  • Tulis script program di atas, kemudian simpan dengan nama file jam.html
  • Script program diatas terdiri dari script HTML dan Javascript.  script javascript yang ada di dalam tag <script>…</script>
  • Perhatikan tag <span id=”tick2″ style=”font-size: 22px;”></span> gunanya adalah untuk menentukan lokasi dimana aplikasi jam akan diletakan di sebuah halaman web.
  • Untuk menjalankannya, Anda tinggal mengklik 2 kali file jam.html tersebut. karena filenya berupa Html maka programpun akan segera di jalankan.

Catatan :

  • Seperti yang anda tahu bahwa cara penulisan javascript ada yang ditulis dengan cara di satukan dengan script HTML atau PHP, ada juga dengan memisahkanya dengan membuat file baru misalnya jam.js.
  • Sehingga jika anda menuliskanya dengan cara memisahkan file javascript dengan HTML, maka anda perlu memanggil file tersebut dengan perintah <script language=”javascript” src=”jam.js”></script>
  • Kemudian tinggal meletakan tag <span id=”tick2″ style=”font-size: 22px;”></span> dihalaman yang memanggil file jam.js tersebut.

Sekian tutorial dari saya, semoga bermanfaat :)

Depok, 27 Februari 2010

noname


About these ads

3 Responses

  1. mas agus gimana settingan waktu untuk indonesia?

  2. http://www.ricocheting.com/code/javascript/html-generator/date-time-clock

  3. Terima Kasih Atas tutorialnya .. artikel yang sangat bagus ..

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

Join 523 other followers

%d bloggers like this: