Cara Memberi Efek Hover Shadow

Posted by

Cara Memberi Efek Hover Shadow- Akhir akhir ini saya sangat tertarik sekali sama yang namanya efek hover. Memang bagi para blogger dan saya sendiri sudah tau betul yang namanya efek hover..Bagi anda yang belum tau apa yang dinamakan efek hover yaaa.. saya kasih tau.. Hyhyhy. Efek Hover adalah Efek yang
di tunjukkan (bisa apa saja) pada halaman website atau blog cursor kita,kita arahkan ke gambar atau tulisan(atau semacamnya, dll) yang bila mana di klik akan ke halaman yang lain(link lain).. Udah Jelas.. kalo belum, coba baca ini, Dah ngerti?? kalo belum(yang orang jawa) waliken kelambimu...
Disini kita akan mencoba tentang bermacam-macam efek hover yang belakangan ini saya pelajari dan coba.. hasilnya ada yang bagus dan ada yang kurang memuaskan.. Tenang aja saya hanya akan memberi yang sekiranya menyenangkan aja kok!! Sebenarnya Efek Hover itu bila di sungguhi akan menghasilkan sesuatu yang menarik kok..
Taukan yang namanya shadow?? yaa.. shadow adalah bayangan. jadi kita akan membuat efek hover menggunakan efek bayangan(shadow)
Yaaa.. dari pada lama lama kita langsung aja ke intinya
.

Cara Memberi Efek Hover Shadow pada link
taukan yang namanya shadow?? yaa.. shadow adalah bayangan. jadi kita akan membuat efek hover menggunakan efek bayangan(shadow)

1. Cari kode
a:hover {
text-decoration: underline;
color: #ff0000;
}

2.Nah.. Ganti dengan
a:hover {color:#DF0101;
text-decoration:none;
text-shadow:1px 1px 1px #000000}
Saaannngat sangat mudahkan??



Cara Memberi Efek Hover Shadow pada Gambar
Anda juga bisa menambahkan efeknya ke gambar..
1. Cari kode
.post img { padding: 10px; border: 0px }
-setiap blog berbeda beda

2. Bawahnya tambahkan kode
.post img:hover {-moz-box-shadow: 0 0 13px;}

Mudahkan?? Sebenarnya banyak sekali efek-efek hover yang lainnya tetepi berhubung singkatnya waktu saya hanya bisa memberi efek shdow.. jadi sabar ya.. dan update terus blog ini
JIKA ANDA MENEMUI KESULITAN SILAHKAN HUBUNGI SAYA di contact me


Carel
FOLLOW and JOIN to Get Update!

Social Media Widget SM Widgets




Demo Blog NJW V2 Updated at: 3:12 PM

51 Komentar:

  1. Mantap Sob..
    jadi pingin dicoba ke blog ku..

    ReplyDelete
  2. tips bagus nih
    salam kenal gan

    ReplyDelete
  3. apakah anda sendiri yang membuat kodenya???

    ReplyDelete
  4. @Anonim>> saya rasa ini adalah kode yang berbahasakan XML jadi ini saya ambil dari kode orang tp bukan shadow ,ttp efect lain.. saya yang merubah sendiri tulisan/kodenya menjadi shadow... BEGITU.. ada kekurangan??

    ReplyDelete
  5. Infoo bagus.. langsung coba..

    ReplyDelete
  6. wuih sangat bermanfaat banget..

    thx 4shared

    ReplyDelete
  7. wahhh dapet ilmu baru nihh kawan,,
    mksi infonya... sne coba dlu ke tkp

    ReplyDelete
  8. wah,, mantap jik... thank 4 infonya....

    ReplyDelete
  9. mantap kang triknya..makasih ya atas infonya..

    oh ya boleh tukaran link gak...???

    ReplyDelete
  10. mantap kang triknya..makasih ya atas infonya..

    oh ya boleh tukaran link gak...???

    ReplyDelete
  11. mantap ya kang atas infonya..makasih ya atas kunjungannya..

    oh..ya nanti bentar aku balas follownya..alnya aku cuma pake HP nih...

    slam buat semuanya

    ReplyDelete
  12. kayaknya bagus ni....
    di coba dulu bro...

    ReplyDelete
  13. Ijin kopas kodenya ya kang...
    Buat referensi tutorial.

    Sukses selalu...

    ReplyDelete
  14. @ Eka>> yang penting kasih sumbernya

    ReplyDelete
  15. thanks infonya sob,, langsung saya praktekin yang
    Hover untuk link.

    sekalian tuker follow ya, di tunggu laporannya..

    ReplyDelete
  16. Mantab infonya...
    Tak coba dulu ya...

    ReplyDelete
  17. satu kata yang dapat kuucapkan,
    mantaaaf

    ReplyDelete
  18. Blogwalking gan..ditunggu kunjungan balikna:)

    ReplyDelete
  19. dua kata untuk agan...bagus bheet

    ReplyDelete
  20. dan akhirnya dapat pencerahan makasih sob info cssnya .. tapi apakah itu valid css atau gmana sob .... lam kenal chapila.com

    ReplyDelete
  21. Wow, this is the best site I’ve ever read. Thank you for sharing this.

    ReplyDelete
  22. Big thanks for the useful info .

    ReplyDelete
  23. Great post, I am really enjoying
    the process & journey your taking us on.

    ReplyDelete
  24. coba praktekin neh di blogspot ane :http://mannaungi.blogspot.com/

    ReplyDelete
  25. nebeng sedot gan. http://dualima.com/blogger-nusantara-blogpreneur-indonesia.html

    ReplyDelete
  26. Nice Infonya Sob...
    Kunjungan Balik ya..

    ReplyDelete
  27. Great job!

    It is utterly right. I admire your thoughts and perception. Hope to see new updates from your soon. Thanks for sharing.

    ReplyDelete
  28. copas yang ga di sertakan sumber itu tandanya blogger payah

    ReplyDelete

SUARAKAN SUARAMU