Foto Sampul

Tab Profil

Kronologi Tentang Teman Foto
Santa Mars

Membuat Animasi Login Di Home Blog


Sabtu, 23 Maret 2013

Animasi Login Di Home Blog ini memberikan efek manipulasi terhadap blog agar nampak seperti sedang login dengan Cap Jempol. Inspirasi ini saya dapatkan dari tetangga blogger kita dan saya padukan dengan pengalaman tentang jQuery saya. Yah, lumayan memberikan kesan yang menarik para pengunjung ketika berada di home blog kita.

Ya udah langsung tancap tutorialnya gan.


Animasi Login Home Blog

Letakkan Element dibawah ini tepat di atas </body>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- Animasi Login Begin -->
<div id='animasi-loginSM' style='position:fixed;z-index:9001;background:transparent;height:100%;width:100%;left:0;top:0;'>
<script type='text/javascript'>
// ----- Gambar Ukuran 28 x 28 Pixel -----
var  Gambar_Login_Anda ='http://1.bp.blogspot.com/-2KG5Pihvxjg/UPqNqJmGDyI/AAAAAAAABSI/OR8XesX6cGM/s28/Shutdown.png',
       Nama_Login_Anda = 'Santa_Mars';
</script>
<script src='https://sites.google.com/site/blogsantamars/css-santa-mars/animasi-login3.js' type='text/javascript'></script>
</div>
<div id='animasi-munyer1' style='position:fixed;z-index:9000;background:black;height:55%;width:100%;left:0;top:0;'></div>
<div id='animasi-munyer2' style='position:fixed;z-index:9000;background:black;height:55%;width:100%;left:0;bottom:0;'></div>
<div id='animasi-munyer3' style='position:fixed;z-index:9000;background:black;height:100%;width:55%;left:0;top:0;'></div>
<div id='animasi-munyer4' style='position:fixed;z-index:9000;background:black;height:100%;width:55%;right:0;bottom:0;'></div>
<!-- Animasi Login End -->
<b:else/>
</b:if>

Demo


Note!
  • Gambar Login ukuran 28 x 28 pixel

Artikel Terkait

71 komentar:

  1. Balasan
    1. :-bd :-bd :-bd :-bd :-bd
      berhubung kamu baik hati,tidak sombong,dan suka menabung ane kasih 5 jempol sekali gus ..... ckakakakkk

      Hapus
  2. Balasan
    1. udah gan, nanti saya kasih link downloadnya :Q

      Hapus
  3. Mantab Mas Bro, langsung sedot yah, terimakasih :D :-bd

    BalasHapus
  4. css body nya kok mirip sama blognya omz day

    BalasHapus
  5. Mantaap Gan Keren ..
    Tapi Kok Diblog saya Disemua tempat gak di Home doang ??
    tolong dong pencerahannya .. :'(
    Visit Juga > http://tankrank-city.blogspot.com/

    BalasHapus
  6. Keren Bang Santa \o/


    Teruslah Berkarya Dan Membuat Animasi-animasi SEO :-bd

    BalasHapus
  7. kok saya pencet tombolnya kgk bisa dibuka blog saya? kgk bisa dipencet tombolnya.. mohon dong penjelasannyaa

    BalasHapus
  8. kok abis login sukses gk kehalaman blognya , malah hitam semua < blank >

    BalasHapus
  9. Ooohh... ini khusus untuk template buatanmu doang om? aku coba pake templatemu berhasil!!

    BalasHapus
  10. tapi saya coba jadi ko.
    nih blognya

    http://kumpulan-trikblog.blogspot.com

    BalasHapus
  11. tapi saya coba jadi ko.
    nih blognya

    http://kumpulan-trikblog.blogspot.com

    BalasHapus
  12. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  13. NUMPANG tenar. wkwkwk

    http://ali-creations.blogspot.com/

    BalasHapus
  14. \o/ mantaappp....
    nice post mas...kapan2 ijin share

    BalasHapus
  15. gan , pertama nya bisa ,, tp kok tak buka lagi gambarnya item semua ?

    tolong bantu

    BalasHapus
  16. keren gan, tapi ko di template sya masang animasi login gak bisa ya, coba cek n mslh nya dmna gan?

    BalasHapus
  17. gan animasi login blog saya kok gak ada gambar loginnya y,, salah apanya gan....

    BalasHapus
  18. gan ko ga keluar animasinya ? cuman gambar item doank ?

    BalasHapus
  19. javascriptnya sedang banned gaaan
    tunggu masternya datang ^:D

    BalasHapus
  20. gan script nya ke banned google,mohon di betulin

    BalasHapus
  21. ckkckckck.....fitur edit template bnyk yg kaget....scriptnya ga jalan

    BalasHapus
  22. item semua gan.,,,
    tolong penjelasannya.,., :-bd

    visit please:
    http://rama-boys.blogspot.com/

    BalasHapus
  23. ijin pake ya gan :D

    htpp://nandarious.blogspot.com

    BalasHapus
  24. makasih gan .. tutornya sangat good hehehe ikut praktek dolo

    BalasHapus
  25. thanks om :-bd



    http://ngei-mbojo.blogspot.com/

    BalasHapus
  26. bang santa, kog setelah animasi login'nya berakhir layar jadi item semua bang? elemen animasi-loginSM nya kagak mau ilang.. gimana bang? mhon solusinnya
    xardhix.blogspot.com

    BalasHapus
  27. kok gak bisa sih
    tetap saja
    tapi keren lho gan

    BalasHapus
  28. bisa bikinin css-nya um,..?
    thank's..

    BalasHapus
  29. Mantaaaaaaaaaaaaaaaapppppppppppp gannnn ... Loe emang masternya Blog .. Kasih jempol Yang Banyak Ah .. :D :-bd :-bd :-bd :-bd :-bd :-bd :-bd :-bd :-bd :-bd :-bd :-bd :-bd :-bd :-bd :-bd :-bd

    BalasHapus
  30. punya ane napa gak bisa gak?
    cuman muncul icon shutdownnya doang tapi di click gak bisa ~x( ~x( ~x(

    BalasHapus
  31. Klo Dipake Di Website Bukan Di Blog Gimana ya?
    Ane Coba Kok Gk Bisa, Apa Ada Tambahan Dikit?

    BalasHapus
  32. Klo Untuk Website Bukan Blog Gimana Ya?
    Terimakasih

    BalasHapus
  33. kok pda saat saat buka blog ane kok tampilannya hitam terus,,

    solusinya gimana mas,

    BalasHapus
  34. mas saya boleh minta script php nya gk yg kyk gini ?
    inbox ya

    BalasHapus
  35. Rusuh yuk . blog gw jadi gak bisa dilihat nih

    BalasHapus
  36. Gan, kok saat gua taro scriptnya di HTML, setelah di save, tidak muncul gambar nya??
    layarnya item semua

    BalasHapus
  37. Kalo Template Blognya kak Santa Mars ini apaa...??

    BalasHapus
  38. Gan kok gak jalan klo di browser lain/komputer lain juga?? klo di komputer sendiri bisa

    BalasHapus
  39. MAKASI BANGET BUAT INFO NYA SOB ,,
    KUNJUNGI bLOG SAYA GAN,, sophian09.blogspot.com

    BalasHapus

Copyright © 2016 | Privasi | SiteMap | Follow | Download Template