Monday 5 May 2014

Membuat Jam,Hari, dan Tanggal dengan Javascript di Blog

Membuat Jam,Hari, dan Tanggal dengan Javascript di Blog - Setelah beberapa minggu tidak posting dikarenakan ada persiapan buat UTS, pada kesempatan kali ini saya akan membahas tentang Cara Membuat Jam ,Hari, dan Tanggal dengan Javascript di Blog yang saya ambil referensi dari Blog Kang Rian. ...
jam js

Ada beberapa pilhan yang tersedia pada menu tersebut, jika anda suka silahkan lihat dan pelajari javascript dibawah ini:

1. Tanggal dengan Javascript:
Kode Javascriptnya:
<script type="text/javascript">
<!--
var months = ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember'];
var date = new Date();
var day = date.getDate();
var month = date.getMonth();
var yy = date.getYear();
var year = (yy < 1000) ? yy + 1900 : yy;
document.write(day + " " + months[month] + " " + year);
//-->
</script>

2. Hari dan Tanggal :
Kode Javascriptnya:
<script type='text/javascript'>
<!--
var months = ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember'];
var myDays = ['Minggu', 'Senin', 'Selasa', 'Rabu', 'Kamis', 'Jum&#39;at', 'Sabtu'];
var date = new Date();
var day = date.getDate();
var month = date.getMonth();
var thisDay = date.getDay(),
    thisDay = myDays[thisDay];
var yy = date.getYear();
var year = (yy < 1000) ? yy + 1900 : yy;
document.write(thisDay + ', ' + day + ' ' + months[month] + ' ' + year);
//-->
</script>

3. Jam sekarang (Pasif):
Kodenya Javascriptnya:
<script type="text/javascript">
<!--
var d = new Date();
var curr_hour = d.getHours();
var curr_min = d.getMinutes();
curr_min = curr_min + "";
if (curr_min.length == 1) {
    curr_min = "0" + curr_min;
}
document.write(curr_hour + " : " + curr_min);
//-->
</script>

4. Dengan Format AM/PM
Kode Javascriptnya:
<script type="text/javascript">
<!--
var a_p = "";
var d = new Date();
var curr_hour = d.getHours();
if (curr_hour < 12) {
    a_p = "AM";
} else {
    a_p = "PM";
}
if (curr_hour == 0) {
    curr_hour = 12;
}
if (curr_hour > 12) {
    curr_hour = curr_hour - 12;
}

var curr_min = d.getMinutes();
curr_min = curr_min + "";
if (curr_min.length == 1) {
    curr_min = "0" + curr_min;
}
document.write(curr_hour + " : " + curr_min + " " + a_p);
//-->
</script>

5. Jam Sekarang (Aktif):
Kode Javascriptnya:
<div id="clock">
</div>
<script type="text/javascript">
<!--
function showTime() {
    var a_p = "";
    var today = new Date();
    var curr_hour = today.getHours();
    var curr_minute = today.getMinutes();
    var curr_second = today.getSeconds();
    if (curr_hour < 12) {
        a_p = "AM";
    } else {
        a_p = "PM";
    }
    if (curr_hour == 0) {
        curr_hour = 12;
    }
    if (curr_hour > 12) {
        curr_hour = curr_hour - 12;
    }
    curr_hour = checkTime(curr_hour);
    curr_minute = checkTime(curr_minute);
    curr_second = checkTime(curr_second);
 document.getElementById('clock').innerHTML=curr_hour + ":" + curr_minute + ":" + curr_second + " " + a_p;
    }

function checkTime(i) {
    if (i < 10) {
        i = "0" + i;
    }
    return i;
}
setInterval(showTime, 500);
//-->
</script>
Semoga bermanfaat.

62 comments

wah banyak banget JSnya, ijin ambil satu sob
buat blog saya :D

:-d banyak code nya ya buat js ijin coba 1 1

waw jadi lebih keren pastinya kalo blog ada tanggal dan hari :D

wah kren nih gan ijin coba ya

nice share, thanks... Salam from Dollar Island

di BM buat diterapkan di blog,,, thanks gan.

wah, keren ini. tambah koleksi trik

keren kapan - kapan saya coba gan tuts nya

keren gan
saya coba dulu ya

Widget nya mantap gann (y) terus berkarya ya gan

wah keren buat ngitung ulang tahun

wah keren gan jamnya, izin praktiin ya

keren ya... tampilannya jadi bisa live gitu

kira-kira menggangu loading blog ngga mas ?

Bang, ini masukin javascriptnya di gadget ya?

silahkan di ambil sob gak bakal habis kok :D

silahkan dicoba sob, dipraktekkan

iya sob tapi agak berat loadingnya.. :)

salam kembali dari pekalongan :D

silahkan gan.. moga bermanfaat

silahkan gan, kapan saja boleh dicoba :)

hehe, kalau buat ulang tahun beda lagi scriptnya gan,, tapi kalau pandai mungkin bisa di kembangkan :)

silahkan di praktekkan :)

iya sis :) jadi bisa lihat waktu sekarang :D

sedikit sob karena pemakaian js akan mengurangi loading

bisa di gadget atau di edit HTML nya sist :)

salam sapa sahabat mas, sudah UTS atau Baru mau ni mas?
semoga sukses ya mas mawan...
saya bookmark dulu ya mas, soalnya saya lagi seneng liat blog cepet ,hehe

hehe ternyata jam nya sama dengan jam waktu jakarta :D

wah, bolh dicoba nih, thanks gan

baru uts ,Amin..:) silahkan di bookmark mas, siapa yg blognya cepet :D

tergantung pc kita mas firman,, :)

sama-sama gan :) silahkan dicoba coba dulu

Dulu saya sempat pasang tapi sudah di bongkar lagi he... :)

wah membuat berat ya mas :D

saya takut bikin lmot mas,,,,
blos saya saja tidak pake widget :v recent pos

sebagai alternative mas, wah biar hemat ruang yah :D

jadi tambah keren ya blog nya kalau ada jam dan kalender nya ;)

iya sist.. biar inget waktu hehe :)

Menambah kerennya blog mas, tapi hanya untuk WIB saja ya hehe :D

sebenarnya tergantung pc mas, kalau untuk wilayah lain ada tambahan script lagi :D

This comment has been removed by a blog administrator.

Tapi keren kok, hehe. Saya dulu pernah pasang, tapi sekarang males :D

iya mungkin nanti juga saya akan hapus tuh yg di atas :D

Kenapa mas Mawan ? hehe
Wih ganti lagi logo blognya :-bd

gak pandai bikin,logo.. hehe biar lebih ringan lagi loadingnya

Ini cocok buat mengingatkan waktu kalau di pasang di Blog, biar ingat kalau jam udah malam waktunya tidur :D

bener sist Dian.. :0 biar gak lupa waktu,hehe

Tapi bagaimanapun juga kalau lagi keasyikan tetap lupa waktu mas, hehe =D

itu sudah melewati batas =D

terimakasih banyak sob tutorialnya, menarik banget..

http://obattraditional.com/obat-tradisional-ambeien/

wah makasih gan tutorialnya

kunjungi juga punya saya ni gan
http://feridi.blog.upi.edu/

izin ubrak abrik yak :D
makasi :)

Wah banyak sekali :)

Tapi keren, izin ngambil ya :D

This comment has been removed by a blog administrator.

Note:
► Silahkan Berkomentar Sesuai Tema.✔
► No LINK. SPAM & PROMOSI ✘
► Segala Komentar Yang Masuk tidak Saya Moderasi ✔
► Dilarang Promosi (kecuali Ijin dan disetujui Admin ) ✔
► Link Hidup = Hapus.✔


EmoticonEmoticon