Tweet Kreasi Label Blog dengan Efek Nudging

Screenshoot Efek Nudging

Setelah saya sekian lama ngutak-ngatik blog, saya kira sudah lama tidak share artikel lagi. memang bener yah ganti template blog malah buang-buang waktu, tapi share kali ini saya bukan mengenai tentang template melainkan membuat efek nudging pada label blog, mungkin cara ini sudah tidak aneh lagi bagi para blogger. Tetapi saya ini cuman memberikan sekedar informasi. efek nudging ini membuat link secara halus ketika mouse diarahkan pada label tersebut, pasti efek ini akan menambah sedikit keindahan pada blog Anda. Jika Anda tertarik dengan efek nudging pada label ini silahkan ikuti langkah-langkah dibawah ini:

Seperti biasa:

• Login ke blogger > Edit HTML
• Letakkan script Jquery dibawah ini diatas kode </head>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" ></script>

Catatan: Jika Anda sudah terdapat script diatas maka lewati saja cara diatas.

• Setelah itu tambahkan script berikut ini dibawah script Jquery tadi. paham kan? 

<script type='text/javascript'>

$(document).ready(function() {

$(&#39;#Label1 li&#39;).hover(function() { //mouse in

$(this).animate({ marginLeft: &#39;12px&#39; }, 400);

}, function() { //mouse out

$(this).animate({ marginLeft: 0 }, 400);

});

});

</script>

• Langkah terakhir save template Anda dan coba lihat hasilnya. 

Catatan: Jika Anda ingin melihat Efek Nudging pada label ini maka Anda harus menggunakan Label dengan tampilan Daftar.

Itulah tutorial Label Blog dengan Efek Nudging, jika Anda ada yang tidak paham silahkan tanyakan dikotak komentar yang sudah disediakan. Semoga bermanfaat dan Selamat Mencoba!

Information Article:

Rating: 5

Description: Kreasi Label Blog dengan Efek Nudging Reviewer: Rezza Indra Rahayu

Itemreviewed: Kreasi Label Blog dengan Efek Nudging