Hallo, udah lumayan lama nih gak posting karena masih pikirin konten terbaru di BibipBoy. Tapi kali ini saya udah dapat konten mengenai HTML. Pada postingan kali ini akan membahas mengenai Membuat Program Jam Keren Dengan HTML. Postingan kali semoga bisa membantu kalian dalam mengerjakan tugas kuliah atau hal lainnya. Gampang kok simak baik-baik tutorial atau langkah-langkah di bawah ini.
Software yang diperlukan :
1. Notepad ++
1. Notepad ++
2. Browser seperti Mozilla atau Google Chrome
Langkah-langkah :
1. Pertama kalian siapkan Notepad ++ yang kalian sudah miliki.
2. Masukkan kode atau script dibawah ini kedalam Notepad ++ tersebut.
<!DOCTYPE html>
<html>
<head>
<title>Program Jam Sederhana</title>
<script type="text/javascript">
window.setTimeout("renderDate()",1);
days = new Array("Minggu","Senin","Selasa","Rabu","Kamis",
"Jumat","Sabtu");
months = new Array("Januari","Februari","Maret",
"April","Mei","Juni","Juli","Agustus","September",
"Oktober","November","Desember");
function renderDate(){
var mydate = new Date();
var year = mydate.getYear();
if (year < 2000) {
if (document.all)
year = "19" + year;
else
year += 1900;
}
var day = mydate.getDay();
var month = mydate.getMonth();
var daym = mydate.getDate();
if (daym < 10)
daym = "0" + daym;
var hours = mydate.getHours();
var minutes = mydate.getMinutes();
var seconds = mydate.getSeconds();
var dn = "AM";
if (hours >= 12) {
dn = "PM";
hours = hours - 12;
}
if (hours == 0)
hours = 12;
if (minutes <= 9)
minutes = "0" + minutes;
if (seconds <= 9)
seconds = "0" + seconds;
document.getElementById("jam").innerHTML = "<B>"+days[day]+" "+daym+" "+months[month]+" "+year+"</B> | "+hours+":"+minutes+":"+seconds+" "+dn;
setTimeout("renderDate()",1000)
}
</script>
</head>
<body onLoad="renderDate()">
<center>
<div id="jam" style="background: green; border: 1px dashed #000;
padding: 30px; width: 700px;" align="center"></div>
</center>
</body>
</html>
3. Save kode tersebut dengan nama yang kalian inginkan dan menggunakan format .html dibelakangnya.
4. Setelah itu kalian bisa jalankan Notepad ++ tersebut dengan menggunakan tombol F5. Jika kalian ingin menjalankannya di Mozilla kalian bisa tekan Ctrl+Alt+Shift+X sedangkan kalau dengan Google Chrome bisa tekan Ctrl+Alt+Shift+R.
Hasilnya :
- Kode berwarna merah untuk mengganti warna background jam sesuai dengan keinginan kalian.
- Kode berwarna hijau untuk mengganti ukuran background jam.
- Kode berwarna biru untuk mengatur posisi jam.
Nah itulah langkah-langkah untuk membuat jam keren dengan HTML, gimana mudah kan? bisa kalian variasikan agar lebih keren dan menarik tentunya. Sekian postingan BibipBoy kali ini mengenai Membuat Program Jam Keren Dengan HTML semoga berguna dan bermanfaat bagi kalian. Terima Kasih.
Nah itulah langkah-langkah untuk membuat jam keren dengan HTML, gimana mudah kan? bisa kalian variasikan agar lebih keren dan menarik tentunya. Sekian postingan BibipBoy kali ini mengenai Membuat Program Jam Keren Dengan HTML semoga berguna dan bermanfaat bagi kalian. Terima Kasih.
No comments:
Post a Comment