membuat Jam dengan script Mentah 3

Style jam ketiga ini lebih dominan dengan adanya background yang menghiasi, dari itu js ini kita butuh bantuan CSS agar lebih efektif jika dibandingkan menggunakan background html dan jika sobat ingin mengedit akan terhindar dari kesalahan karena akan berpengaruh ke script.

Lihat juga tampilan jam
PERTAMA dan KEDUA
dan ini tampilan ketiga


Demonstrasi



LANGKAH PERTAMA
Pasang css ini
<style> <!-- .ykn{ background-color:black; color:khaki; -moz-border-radius:1em; border:1px solid khaki; font: bold 15px MS Sans Serif; padding: 3px; } --> </style>
Keterangan :
black : warna latar
khaki : warna text
-moz -border -radius : membuat garis lengkung versi web
border : khaki warna garis.

LANGKAH KEDUA
Gunakan script ini buat menampilkan jam letak dimana anda sukai
<span id="clocky" class="ykn"></span> <script> <!-- /***************************************** * Clock script yakubnay *****************************************/ var alternate=0 var standardbrowser=!document.all&&!document.getElementById if (standardbrowser) document.write('<form name="tick"><input type="text" name="tock" size="6"></form>') function show(){ if (!standardbrowser) var clockobj=document.getElementById? document.getElementById("clocky") : document.all.clocky var Digital=new Date() var hours=Digital.getHours() var minutes=Digital.getMinutes() var yn="AM" if (hours==12) yn="PM" if (hours>12){ yn="PM" hours=hours-12 } if (hours==0) hours=12 if (hours.toString().length==1) hours="0"+hours if (minutes<=9) minutes="0"+minutes if (standardbrowser){ if (alternate==0) document.tick.tock.value=hours+" : "+minutes+" "+yn else document.tick.tock.value=hours+" "+minutes+" "+yn } else{ if (alternate==0) clockobj.innerHTML=hours+"<font color='khaki'> : </font>"+minutes+" "+"<sup style='font-size:1px'>"+yn+"</sup>" else clockobj.innerHTML=hours+"<font color='black'> : </font>"+minutes+" "+"<sup style='font-size:1px'>"+yn+"</sup>" } alternate=(alternate==0)? 1 : 0 setTimeout("show()",1000) } window.onload=show //--> </script>



Next....