Blogger Note

Article :

Cara membuat Link Nudging dengan CSS


Pasti sudah bisa di tebak dari judulnya,yupz memang sudah kelihatan kalau malam ini saya akan memberikan tutorial 'Cara membuat Link Nudging dengan CSS',mungkin sebagian udah pada tau maksudnya link lugning,tapi kalo belum tau biar saya jelasin deh,yang saya maksud 'Link Nudging adalah,penambahan efek bergoyang pada link yang disorot oleh kursor kamu,ok untuk demonya silahkan kamu lihat demonya dibawah ini
gimana lumayan baguskan,dan pastinya enggak akan mempengaruhi berat blog,untuk cara2 membuatnya dibawah ini

Kode CSS
#animateList li a {
-moz-transition: all 0.26s ease-out;  /* FF4+ */
-o-transition: all 0.26s ease-out;  /* Opera 10.5+ */
-webkit-transition: all 0.26s ease-out;  /* Saf3.2+, Chrome */
-ms-transition: all 0.26s ease-out;  /* IE10? */  
-moz-transition-duration: 1s;}
#animateList li a:hover {
padding-left: 100px;
} 
Kode HTML
<div id="animateList">
<li><a href="#">Tautan Satu</a></li>
<li><a href="#">Tautan Dua</a></li>
<li><a href="#">Tautan Tiga</a></li>
<li><a href="#">Tautan Empat</a></li>
</div>
 Ok,itu aja kodenya,semoga berhasil dan salam sukses for u

65 comments:

14 Oktober 2011 07.53

PERTAMAX!!!! wah link Nungging?

14 Oktober 2011 07.53

PERTAMAX doloo,, :D

14 Oktober 2011 07.55

surimmm,, =,=" keduluan sama faris mulu nih gw,, azzzzz.. btw,, ane udah pasang di menu nav blog ane.. :D

14 Oktober 2011 07.57

waaa... dpt keempat nih.. :D
tipsnya entar aja dhe dicoba, kyaknya keren nih.. :)

14 Oktober 2011 07.57

AKHIRNYA Update juga, tapi ane malah udah tau :P

biar judulnya menarik ganti ini aja -> Efek Link Nungging

14 Oktober 2011 08.27

@FarixsantipsLink nudging,bukan link nugging

14 Oktober 2011 08.27

@Rama88Keduax tuh

14 Oktober 2011 08.28

@Rama88Hahaha :D

14 Oktober 2011 08.28

@Shinobi CaemkBookmark aja mas

14 Oktober 2011 08.28

@Mbah QopetHehehe.....,simak aja lah :d

14 Oktober 2011 08.29

keren-keren ya triknya mas musa ini :)

14 Oktober 2011 08.29

wah sob,,up date juga ya dgn tampilan simple dan keren pula,,nice info sob trims

14 Oktober 2011 08.44

sy sudah banyak mempelajari nungging2 d blogny mas hompimpa :D

14 Oktober 2011 08.53

Kalau judul /title yg nuding bisa ngak ,Mus?

14 Oktober 2011 09.33

@Aku mau gratisan

bisa di taruh di mana aja kok sob...

14 Oktober 2011 13.39

sepertinya link nungging bagus ni di pasang di judul artikel, nanti coba aaahh.

14 Oktober 2011 14.38

Pake Transition Nih

14 Oktober 2011 17.47

Bisa dipraktekkan nih tipsnya sahabat..makasih

14 Oktober 2011 18.49

Perlu dicoba nih...

14 Oktober 2011 20.24

Kunjungan silaturahmi sahabat..terima kasih telah berbagi tipsnya sahabat

14 Oktober 2011 20.57

wkwkwkw,, ternyata beda sama punya ane ,, asemmm,, ntar ane coba ahhh,, :D

14 Oktober 2011 22.49

@Musa Khairul Umam link nungging ada yang pake Jquery juga kan? bagusan ini brarti pake easyout

14 Oktober 2011 23.19

izin coba :)

14 Oktober 2011 23.32

tambah berat ga nih ?

15 Oktober 2011 00.04

wahh bagus bang.. tar aku bookmark dlu yak :D makasi tdi kunjungannya ya :D

15 Oktober 2011 03.54

@bayu aldi yansyahThanks :D

15 Oktober 2011 03.54

@al kahfiWow,thanks kunjungnnya

15 Oktober 2011 03.55

@Cek InfoSimak aja lagi hehehehe... :D

15 Oktober 2011 03.55

@Aku mau gratisanBisa mas

15 Oktober 2011 03.55

@ZONA DOWNLOAD GRATISSilahkan dicoba mas :D

15 Oktober 2011 03.56

@Zh!nThoHehehehe iya nih

15 Oktober 2011 03.56

@tamannya-hatiSama2

15 Oktober 2011 03.56

@cardiackuSilahkan dicoba

15 Oktober 2011 03.56

@webmdmkSama2

15 Oktober 2011 04.04

@Rama88Silahkan dicoba mas

15 Oktober 2011 04.05

@DodeSilahkan dicoba mas

15 Oktober 2011 04.05

@richardEnggak kok,coz nih pake css

15 Oktober 2011 04.05

@Ridzahul KhairinTerima kasih juga udah mau main2 kesini

15 Oktober 2011 06.33

Amazing sob, ini kemudian tambah gadget kan?

15 Oktober 2011 07.23

kunjungan malam sob, belum sempet coba ni script

15 Oktober 2011 08.59

Simple kodenya Mas, ntar saya coba di blog saya deh.

15 Oktober 2011 14.53

yoi gan, comment lg biar eksis :D

15 Oktober 2011 16.16

keren banget nih, nanti dicoba ahh, thanks mas :D

15 Oktober 2011 16.20

kok saya coba gak ada efek?

15 Oktober 2011 16.38

bagus nih bro tricknya,nati aku coba praktekin deh..tapi judulnya lbih bagus Cara membuat Link Nurdin deh wkkwkwkw pis sob :D ... met pagi ea..^^

15 Oktober 2011 21.13

@Bisnis Online BlogTambah gadget juga bisa gan

15 Oktober 2011 21.13

@ZONA DOWNLOAD GRATISLain kali dicoba ya

15 Oktober 2011 21.13

@Rudy AzharThanks kunjungnya master

15 Oktober 2011 21.13

@Cek InfoThanks Komennya

15 Oktober 2011 21.14

@DODE-XP.COMSaya coba bisa tuh

15 Oktober 2011 21.15

@Venomia BlogWkwkwwk noordin m top kali

20 Oktober 2011 06.48

@Farixsantips mantep sob ane juga pakai link nudgingnya pake css salam kenal aja

20 Oktober 2011 08.10

muntef gan........

23 Oktober 2011 00.36

ALHMDLLH.. akhirnya ketemu juga disini tutorialnya neh,,, muter2 dari td gak ketemu2..ketemu satu tapi malah bingung!!!
Hwehehe...
Moga aja bisa ngerti neh Sob,,, MAKASI BGT yach!!!

Hmmm,,, kalo dibuat Linknya semua bisa goyang git,, gimaana yach>>
Apa cm ditaruh di CSS doang,, bisa semuanya???

2 November 2011 03.37

wah asik nih..boleh dicoba Sob

6 November 2011 16.50

kalau ane pribadi lebih suka pake efek shadow atau neon ketimbang efek nudging :)

13 November 2011 00.28

Wuuuiiiihhh... keren sob.... lagsung tak praktekin ach....

14 November 2011 04.15

Kagak begitu ngerti ane kang! Tapi nice share & nice blog sob, tampilannya minimalis tapi rame.

Keep posting!

15 November 2011 08.34

nice info gan

BTW
coba agan cek blog ane cara buat judul postingan yang miring itu gimana caranya.....
soalnya itu template download

necromongers

22 November 2011 15.35

Keren nih blog nya...

oya mau tanya bkin Reply coment kalau di reply semakin menyudut seperti ini gmna caranya ya sob?? :)

26 November 2011 20.55

salam kenal sob,,, masih pusing ma css

19 Januari 2012 16.32

asik nih bang musa saya coba praktekin yaa

9 April 2012 22.30

seeepp,, mantap gan...,!!

1 Juni 2012 22.36

Tutorialnya bagus gan...

Posting Komentar