Membuat icon menu animasi di blog - JQUERY

haloo semua ..hemz...
Menu yang atraktif pasti lebih disukai daripada menu biasa, salah satunya dengan icon gambar.
Icon Gambar yang sesuai dapat membercantik tampilan blog kita.Tapi bukan cuma sekedar menu biasa! menu kali ini akan membesar jika diekati oleh kursor.
seperti tampilan menu yang aku pakai..
pengen tau cara pembuatannya.. okey
kita bahas disini..

* Login ke Blogger lalu masuk ke "Rancangan" -> "Edit HTML"
* paste kode dibawah ini dibawah </body>


<script src='http://motaro44.freetzi.com/motaroquery.js' type='text/javascript'/>
<script src='http://motaro44.freetzi.com/interfacenyamotaro.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(
function()
{
$(&#39;#dock&#39;).Fisheye(
{
maxWidth: 50,
items: &#39;a&#39;,
itemsText: &#39;span&#39;,
container: &#39;.dock-container&#39;,
itemWidth: 90,
proximity: 90,
halign : &#39;center&#39;
}
)
}
);

</script>

<style type='text/css'>
.dock {
position: relative;
height: 50px;
padding-left:0px;
margin-top:50px;

}
.dock-container {
position: absolute;
height: 50px;
padding-left: 20px;

}
a.dock-item {
display: block;
width: 60px;
color: #adf558;
position: absolute;
top: 20px;
text-align: center;
text-decoration: none;
font: 14px Arial, Helvetica, sans-serif;
}

.dock-item img {
border: none;
margin: 5px 10px 0px;
width: 100%;
}

.dock-item span {
display: block;
padding-left: 20px;
}
</style>

<div class='dock' id='dock' style='display: block;'>
<div class='dock-container' style='left: -7.48972px; width: 814.979px;'>
<a class='dock-item' expr:href='data:blog.homepageUrl' style='width: 90px; left: 0px;'><img alt='home' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhomY_8fvinY5dZFkdVqfgMdWtqzLPfHyfBKHhGvJ_LIesGU3OoQt7LEC68NawsfI4MUJmkci_zpygLx-lhFr_6WRkohUM-SFDFnQPMa_pKlofMkLf26U2nB_rEwjqkO7jhuD74VSJQn8/s320/homeijo.png'/><span style='display:block;'>Home page</span></a>

<a class='dock-item' href='link 2' style='width: 90px; left: 90px;'><img alt='GiÃ�ï¿½Ã�Â¡Ã�ï¿½Ã�Â»Ã�Â¯Ã�Â¿Ã�Â½i thiÃ�ï¿½Ã�Â¡Ã�ï¿½Ã�Â»Ã�Â¯Ã�Â¿Ã�Â½u' src='http://i342.photobucket.com/albums/o433/bkprobk/about.png'/><span style='display:block;'>Introduce</span></a>

<a class='dock-item' href='link 3' style='width: 90px; left: 180px;'><img alt='DÃ�ï¿½Ã�Â¡Ã�ï¿½Ã�Â»Ã�Â¯Ã�Â¿Ã�Â½ch vÃ�ï¿½Ã�Â¡Ã�ï¿½Ã�Â»Ã�ï¿½Ã�Â¥' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcOpyOeMSdattlTU_zBc8gZpNJeGdkZtnZr4A2D7okj4pN-wqf1sBXwCGFWz1CmlH_n81RBz_KHnlWXmR3zopZzYAaS65MTuhHlH_kg1TetAxn3XFkWDhjWh8eEM13VTgWWckwvh4bn9E/s320/dichvuijo.png'/><span>Service</span></a>

<a class='dock-item' href='link 4' style='width: 90px; left: 270px;'><img alt='Site Ã�ï¿½Ã¯Â¿Â½Ã�Â¯Ã�Â¿Ã�Â½Ã�ï¿½Ã¯Â¿Â½Ã�ï¿½Ã�Â£ thiÃ�ï¿½Ã�Â¡Ã�ï¿½Ã�ÂºÃ�ï¿½Ã�Â¿t kÃ�ï¿½Ã�Â¡Ã�ï¿½Ã�ÂºÃ�ï¿½Ã�Â¿' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcK-j3-DKRHWeBUMVvktpkbAAcof8AUxNKL7e_Z7_fJZ5I_NlOg8uNQ-KcHFsHwVGgBVJP_2rFknoCdmTTAd6gfrDEeepXwx-1Hmc5ahx4h04ofWKDnjv9Yw9ojygj98WdMuME2yCZ5KQ/s320/sanphamijo.png'/>Customer</a>

<a class='dock-item' href='link 5' style='width: 90px; left: 360px;'><img alt='Template' src='http://i342.photobucket.com/albums/o433/bkprobk/template.png'/><span style='display: block;'>Template</span></a>

<a class='dock-item' href='link 6' style='width: 90px; left: 450px;'><img alt='history' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghKHex3q44PI3VnHqReMjjt6rtbWTG3qnNYizrxiS4Im0fOlctRJK0o5WcSWwKP1R4VEarNsaDqsQJtIw-VvIXPsGtv4nhegGFxomT8yRmWxO0btXkvjg_BSKVXIzMRg6UebNJYyy2SK8/s320/historyijo.png'/><span style='display:block;'>Advisor</span></a>

<a class='dock-item' expr:href='data:blog.homepageUrl + &quot;feeds/posts/default&quot;' style='width: 134.979px; left: 540px;'><img alt='calendar' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYqYbBCUTvdbZRwOAXRXer2zea67jiX-H2ZiRHAKJ5KItVYLRdMamwBUYCCeD0lInGuh8BcPjlRsFAjKhaE3kiTwxnjKUPOi5Ho5pLHs5XYi8OLjsnDCheAmufFw66fNZra7vp9u14_7M/s320/doitacijo.png'/><span style='display:block;'>RSS</span></a>

<a class='dock-item' href='link 8' style='width: 140px; left: 674.979px;'><img alt='rss' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiiTOWYcwt7NO7pscHoqXN2PBM6iShHJUB53736mgIH8yGmiJD9bduT6klGJc6EnfXssULViYAduPZmzTvUF4NGBCzbjcuJEreG2JMmHTRv-ux0QoSWjTvM-z1BYtTFs_RynxIkxuQ1LI/s320/emailijo.png'/><span style='display:block;'>Contact</span></a>

</div>
</div>