*Ojeh,..Langsung z nE ea.....!!!
sebagai contoh Lihat dsini:
1.Masuk ke edit HTML car tag : ]]></b:skin>
2.lalu masukan Css berikut di atas kode: ]]></b:skin>
.navigation{
position:relative;
margin:0 auto;
width:915px;
}
ul.menu{
list-style:none;
font-family:"Verdana",sans-serif;
border-top:1px solid #bebebe;
margin:0px;
padding:0px;
float:left;
}
ul.menu li{
float:left;
}
ul.menu li a{
text-decoration:none;
background:#7E7E7E url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxk0u4BKbbAbohAsR0QeWnl6N4j_58JgMN6Mf9CstyuQmErXMneUfeMkfyWz-8UXkD0dqT48vL5qpJXO1tgmt7Po1aapliaznWMNQQWO0s7HGRdhPvNTJ9l6WFNT6T8GeK94dQgnHJQwsU/s1600/bgMenu.png) repeat-x top left;
padding:15px 0px;
width:128px;
color:#333333;
float:left;
text-align:center;
border-right:1px solid #a1a1a1;
border-left:1px solid #e8e8e8;
font-weight:bold;
font-size:13px;
-moz-box-shadow: 0 1px 3px #555;
-webkit-box-shadow: 0 1px 3px #555;
text-shadow: 0 1px 1px #fff;
}
ul.menu li a.hover{
background-image:none;
color:#fff;
text-shadow: 0 -1px 1px #000;
}
ul.menu li a.first{
-moz-border-radius:0px 0px 0px 10px;
-webkit-border-bottom-left-radius: 10px;
border-left:none;
}
ul.menu li a.last{
-moz-border-radius:0px 0px 10px 0px;
-webkit-border-bottom-right-radius: 10px;
}
ul.menu li span{
width:64px;
height:64px;
background-repeat:no-repeat;
background-color:transparent;
position:absolute;
z-index:-1;
top:80px;
cursor:pointer;
}
ul.menu li span.ipod{
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWtrqRhaFjfUfhinHTgTJuO1uP_TrYUQjyFTH2BEXnwW1hvC759Vko4a9O4yL_7PdOk0c-uAo93m-pTIpxq53Dh1tRCoRNpsd6DMV6tpUVZ5Hi5w2EnwpSaANKe4gMlW7D4JDpPA1C3Qx3/s1600/ipod.png);
left:33px; /*128/2 - 32(half of icon) +1 of border*/
}
ul.menu li span.video_camera{
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9EAemL93wMOR-2nhwhckrAJzrJ3tlfMZmDjtlp2QMB8e1ErOJI_LBKtjVkE6HMI8iFpH3Uryw2-SXNL9cuTfS77RTtAeYwNI0jSyXNRxh9YAhBQqacLYjRLqCfhPaygquO2A0gMUVO7Nq/s1600/video_camera.png);
left:163px; /* plus 128 + 2px of border*/
}
ul.menu li span.television{
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0cx1OHFKccvf6RLnQn6hOoGf4gtZbR-R0pCZheimAW9_t-7MqMn5lJznsZ3rsuVuSDhjuDQ6HhO5lLP-ljlErxNVB9d7gdQPT5kitELnxpqvs9t6kKCt7tu9oksSVgKhfJfziaHQfjReC/s1600/television.png);
left:293px;
}
ul.menu li span.monitor{
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBTNpsoww2Dj_q0ZEvyiI7ABTExFC7RCyqQBNKbzH3Dda2ghw0KTjA3xNlLcULXppxmXhERpLBXT-cWb5I_V1eH_yxYeMpe8S8O_87QBX27gDdyF7pVzBTUwqu6KbapfmB4uFP97M1Msnc/s1600/monitor.png);
left:423px;
}
ul.menu li span.toolbox{
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPIFMDi6YcBO1uanzOvdccYjWCU-Zr-nRARmjAnLKEou0SkEMOT6GCOpI9HUCPgfw-oTMasjP2f7uO5fC0SXTA7DvhtkvFq7ohmw4Hw91UdeUM-G8IAu-t71MFakn83zT83heAtD-L-cYo/s1600/toolbox.png);
left:553px;
}
ul.menu li span.telephone{
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjo8XGcfzpfKr99LOlVlfod90V-9yLDj5BGZGZi8Y9999IaMwjWq44ubrg6Hsum9psUpyUJ6uZeGu-yX0f4EufLCw2sOYEPPCebTw8eLzsYckhiCEHJlM30fkxTWIKhgCmcU9pBKDp1AUT9/s1600/telephone.png);
left:683px;
}
ul.menu li span.print{
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhejjxZqh7Mrw5wIt8Pqh1D_gQvAeS-pC_KijGjZRqndVGsST59__8visBKw51ONEclFlHmNBJngK0SvXIOk3zjrwzWdjtULH5L27HGL3fNrvunUSG77iFHgTvWYGTp7eQMSIcCjkDJLHPP/s1600/print.png);
left:813px;
}
dan masukan Html di bwah ini di bwah kode: <body>
atau sobat bisa juga masukan di bagian header
<div class="navigation"><ul class="menu" id="menu"><li><span class="ipod"></span><a href="" class="first">Players</a></li>
<li><span class="video_camera"></span><a href="">Cameras</a></li>
<li><span class="television"></span><a href="">TVs</a></li>
<li><span class="monitor"></span><a href="">Screens</a></li>
<li><span class="toolbox"></span><a href="">Tools</a></li>
<li><span class="telephone"></span><a href="">Phones</a></li>
<li><span class="print"></span><a href="" class="last">Printers</a></li>
</ul></div>
dan simpan jQuery di bwah ini tepat di atas kode: </head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://pandet.googlecode.com/files/menu.js"></script>
