X-Quadrat - Ini adalah Cara sederhana Namun agak ribet, Namun Efeknya akan langsung terlihat berbeda saat anda atau pengunjung lain mengarahkan Cursor/Mouse pada Link yang kita pasang di blog, berharap pengunjung untuk betah berlama2 bertengger di blog kita, hiks... seperti burung aja... Adalah Membuat Title Effect Bounce ZigZag Hover Link Or Image, Atau Efek Zigzag Bounce Saat Mouse diarahkan diatas Link, Baik Link Teks Maupun Link Gambar.
Tekhnik ini memanfaatkan Kode Javascript, Jadi sedikit agak berat saat membuka Halaman Blog, toh ga masalah karena Javascript ini cuman ada 2 yang saya pasang di blog ini, jadi ga berat-berat amat, amat aja ga berat, Soalnya Kurus. hehe...
Untuk liat contohnya Silahkan Arahkan Mouse Anda Keatas Link Teks dan Link Gambar berikut ini :
Gimana, Tertarik? Jika Iya katakan iya, Jika tidak juga tak mengapa, yuk kita ikuti Langkah-langkahnya.
1. Masuk ke blog Anda, Gunakan akun dan sandi anda, telusuri Hingga Anda Sampai ke halaman Edit HTML
2. Copy Kode Berikut ini dan Letakan Dibawah kode <head> atau kalo saya letakkan tepat Diatas Kode <b:skin>
Ini Kodenya :
Kode :
Penggunaanya Sedikit agak Ribet, Anda harus persiapkan Kode ini dan menerapkannya Saat anda membuat Link Teks atau Link Gambar,
Ini adalah Kodenya :
yah sekiranya cukup sekian dulu dari saya tentang Membuat Title Effect Bounce ZigZag Hover Link Or Image , Apabila ada kata-kata yang salah saya mohon maaf yang sebesar-besarnya, Wabilahi taufik wal hidayah, Wassalamu'alaikum warrahmatullahi wabarakatuh.
Tekhnik ini memanfaatkan Kode Javascript, Jadi sedikit agak berat saat membuka Halaman Blog, toh ga masalah karena Javascript ini cuman ada 2 yang saya pasang di blog ini, jadi ga berat-berat amat, amat aja ga berat, Soalnya Kurus. hehe...
Untuk liat contohnya Silahkan Arahkan Mouse Anda Keatas Link Teks dan Link Gambar berikut ini :
Gimana, Tertarik? Jika Iya katakan iya, Jika tidak juga tak mengapa, yuk kita ikuti Langkah-langkahnya.
1. Masuk ke blog Anda, Gunakan akun dan sandi anda, telusuri Hingga Anda Sampai ke halaman Edit HTML
2. Copy Kode Berikut ini dan Letakan Dibawah kode <head> atau kalo saya letakkan tepat Diatas Kode <b:skin>
Ini Kodenya :
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>3. Cari Kode </body> dan letakan kode ini tepat diatasnya
<script src='https://googledrive.com/host/0B1xHV8JisQ9VbkZVUVBaQkZwUk0/' type='text/javascript'/>
Kode :
<script type='text/javascript'>4. Simpan Template.
$(".XQuadratzig a[title]").zigxquadrat({effect: 'bouncy'});
$(".XQuadratzig img[title]").zigxquadrat({effect: 'bouncy'});
</script>
Penggunaanya Sedikit agak Ribet, Anda harus persiapkan Kode ini dan menerapkannya Saat anda membuat Link Teks atau Link Gambar,
Ini adalah Kodenya :
<div class='XQuadratzig'>Penerapanya seperti ini
Kode Link Disini
</div>
<div class="XQuadratzig">Begitupun Penerapan Pada Link Gambar, Lihat Penerapanya :
<div style="text-align: center;">
<a href="http://x-quadrat.blogspot.com/" target="_blank" title="Contoh Efek Bounce By X-Quadrat">Contoh Efek Bounce By X-Quadrat</a></div>
</div>
<div class="XQuadratzig">Yang Perlu Diperhatikan adalah semua Link teks atau gambar harus Memiliki Title Tag, dalam link diatas contohnya adalah title="Title Effect Bounce ZigZag Hover Link Or Image".
<div style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjW0JXA96ZJw8bxLtOqzmV0XaGRjuJVP_vROkY5vu7mAqwOAaGMwVoj1V6-_KQtN-a_9-8fnllMV7zWaJ1q6nUFIGoLwPcaxWVs9_Totr3aMhWUzbIxhQUMXXjzIKcG7iUsx_-oW-mjeQH0/s1600/1111.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="Title Effect Bounce ZigZag Hover Link Or Image" border="0" height="239" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjW0JXA96ZJw8bxLtOqzmV0XaGRjuJVP_vROkY5vu7mAqwOAaGMwVoj1V6-_KQtN-a_9-8fnllMV7zWaJ1q6nUFIGoLwPcaxWVs9_Totr3aMhWUzbIxhQUMXXjzIKcG7iUsx_-oW-mjeQH0/s320/1111.png" title="Membuat Title Effect Bounce ZigZag Hover Link Or Image" width="320" /></a></div>
</div>
yah sekiranya cukup sekian dulu dari saya tentang Membuat Title Effect Bounce ZigZag Hover Link Or Image , Apabila ada kata-kata yang salah saya mohon maaf yang sebesar-besarnya, Wabilahi taufik wal hidayah, Wassalamu'alaikum warrahmatullahi wabarakatuh.
