Cara Membuat Jam Saat Ini dengan Javascript

Assalamu'alaikum sahabat blogger, Nandarious kembali berbagi tutorial blog nih :D setelah kemarin berbagi tutorial blog tentang Cara Membuat Catatan Kaki Artikel di Blog, namun kali ini tentang Cara Membuat Jam Saat Ini dengan Javascript. Kenapa disebut jam saat ini, karena jam, menit, detik nya sesuai dengan jam yang ada di PC kalian. untuk demo nya bisa dilihat di blog ini.

Cara Membuat Jam Saat ini dengan Javascript

Untuk yang tertarik memasang Javascript ini, ikuti tutorial dibawah ini:
1. Login ke Blogger kalian masing-masing
2. ditampilan Dashbord klik Template => Edit HTML
3. Tempatkan kode dibawah ini, tepat diatas </body>
<script type='text/javascript'>

window.setTimeout("hour()",1000);

function hour() {

var date = new Date();

setTimeout("hour()",1000);

document.getElementById("jam").innerHTML = date.getHours()+":"+date.getMinutes()+":"+date.getSeconds();

}</script>
4. Tempatkan kode  <span id='jam'></span> sesuai yang anda mau .
5. Tambakan CSS dibawah ini tepat diatas ]]></b:skin>
#jam {color: #fff;font: 18px Oswald;margin-bottom: 0px;float: right;margin-right: 13px;}
Note : Kode CSS diatas kode jam punya saya, silakan seseuikan kode CSS tertsebut dengan template sobat :)

 Oke cukup sekian tutorial kali ini, semoga bermanfaat :)

Sumber : De5ain Blog :)

Related

Tutorial Blog 6130353965484453075

Post a Comment

  1. Replies
    1. siipphh mas ,, :D

      maaf mas OOT disini ,, tau nggk kenapa kotak komentar.ku kok nggk mau muncul emoticonnya ??? ;((

      Delete
    2. pantesan diblog agan, ada 2 jquery. hapus 1 jquerynya gan :)

      Delete
    3. ohh iya mas ,, udah muncul ,, tpi jquery

      ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js

      saya juga butuh.e mas ??? apa diambil kodenya trus disimpen di google code bisa ??? dan nggk ngaruh kan ???

      Delete
    4. yaudh yg dihapus jquery yang 1.8 aja :D

      Delete
    5. iya keren seh, tapi sy belum bisa pasang yg lain dulu, mesti fokus pasang kotak komentar, udah dua hari ngubek2, gak bisa2

      Delete
    6. hahaha sabar gan :D emang kotak komentarnya knapa?

      Delete
    7. klo di hapus emoticon komentarnya ngk muncul dong mas ??? :) ,,

      Delete
    8. takut nggk berhasil mas :) saya ganti dgn jquery 1.7.1 dan emonya jg saya ganti dari dte ,, takut nggk muncul klo dari mdf ,, tolong di cek mas :D ... hehehe

      Delete
    9. menurut saya emoticon dari MKR ini selalu muncul apabila diblog tersebut ada 1 jquery. saya pake jquery 1.7.2 ini muncul gan :)
      owh iya saya tadi liat, emoticon backgroundnya biru ya :D

      Delete
    10. hehehe iya mas ,, sekarang sudah seperti biasa :D ... dan sudah bisa semua mas :) terima kasih untuk saran-sarannya yah ??? :-d hehehehe

      Delete
  2. Tinggal copy dan vaste kodenya langsung jadi Mas,thks ini Mas :)

    ReplyDelete
  3. gan, bikin slider kayak punya agan tu gimana :)

    ReplyDelete
    Replies
    1. nanti di post :D kalo dikomentar script nya terlalu panjang

      Delete
    2. tambah keren templatenya @-)

      Delete
    3. thanks gan :) blog agan juga bagus :))

      Delete
  4. Okey, thanks....nice shared, Sob!

    ReplyDelete
  5. Kolom komentarnya ngumpet :) nice share sob

    ReplyDelete
  6. Tambah ilmu lagi nih..

    Mksh infonya mas :)

    ReplyDelete
  7. boro2 mau buat jam, sy masih kesulitan buat kotak komentar di blog. awalnya pake kotak komentar blogger, setahun pake intensedebat, terus ganti pake google+, eh sekarang kok sy gak bisa munculkan kotak komentar bawaan blogger. tolongin sy dong nan

    ReplyDelete
    Replies
    1. ganti aja gan templatenya :D

      Delete
    2. ada tutorialnya di DTE mas ,, yg komentar google+ itu ,, nah disitu sebelum tutorial ,, ada kode untuk komentar .... cek aja :D

      Delete
    3. udah dikasih tau tuh mas :-d bilang apa? Makasih :D hehe

      Delete
  8. izin nyimak sob
    ane belum paham beginian

    ReplyDelete
  9. Mantap nih mas bro,,, untuk mempercantik tampilan blog. Oh iya, sekedar saran gambar outer-wrapper yang warna biru kurang match dengan template ini yang dominannya warna merah hati. Coba ganti dengan warna merah hati juga tapi yang opacity-nya kurang dari 90%. Kayaknya lebih cocok... CMIIW

    ReplyDelete
    Replies
    1. oke deh gan :) makasih ya buat masukannya :))

      Delete
  10. Cakep bener mas ... :D

    ReplyDelete
  11. wuih keren ....tapi saya nunggu cara bikin temlate yg keren. :d

    ReplyDelete
    Replies
    1. hahaha :D mau yang kaya gimana gitu mbak indah? :))

      Delete
  12. Artikelnya keren, patut dicoba ni. (o)

    ReplyDelete
  13. wah ane ng suka make javascript sob soallnya lebih berat :)

    ReplyDelete
  14. keren sob,,
    ditunggu visit backnya

    ReplyDelete
  15. gk pake demo ni sob?, bukan demo mahasiswa maksdx :>)

    ReplyDelete
    Replies
    1. hayo ketahuan ga baca teliti ya :-d
      demonya udah ada di blog saya gan :)

      Delete
  16. Replies
    1. nggak juga gan :)) lihat demonya diblog saya :-d

      Delete
  17. asik nih kalau di pasang di blog... tapi mamang belum berani buka daleman blog... hadooooh

    ReplyDelete
  18. css + javascrip ya.. okdeh, kapan-kapan di coba :D .

    ReplyDelete
  19. itu jamnya ga pake PM AM :-) .. `.

    ReplyDelete
    Replies
    1. ngga mbak :D biar terlihat simple aja :)

      Delete
    2. yang penting bisa lihat waktu ya sob..
      pokoknya mantap sobat

      Delete
    3. oke kang :) makasih sudah mampir :D

      Delete
  20. walaah walah.. mantap bgt nih , jdi mau coba pasang nih.. hehe :))
    tapi lain kali aja deh.. udah ga ada tempat soalnnya diblog sayanya mas @-)

    ReplyDelete
  21. Kelihatannya kurang code penutup di javascript nya mas.. :)

    ReplyDelete
    Replies
    1. owh iya gan.. maaf.. tapi postingan udah diperbaiki :)

      Delete
  22. wah ini tutorial yg bagus dan berguna sobat
    trims sudah berbagi

    ReplyDelete
  23. liat komentar di atas, malah ngomongin kotak komentar? padahal topiknya jam wkwkwk

    ReplyDelete
  24. hihihi...mantap boss jamnya, kapan-kapan mau coba.
    terima kasih sudah berbagi, salam.

    ReplyDelete
  25. gampang juga ya..tapi tampilannya keren. Praktek dulu mas..

    ReplyDelete
  26. wah, bagus tuh, biar ntar dipasang di blog mistik saya mas

    ReplyDelete
  27. buat ngingetin kita biar gk kebablasan blogging.. :)

    ReplyDelete

Terimakasih telah membaca artikel di atas. Silahkan berkomentar dengan sopan.

emo-but-icon

Side Ads

Facebook

Adv

item