How to create 3-dimensional menu at blog

IT world as the progress made us more curious about things that are sophisticated .. especially in the virtual world .. such as the Internet. the topic this time I will discuss how to create 3-dimensional menu on the blog. for example at the top of my blog is like that happens.

OK next

First step you must found this code on your HTML in blog:

]]></b:skin>

After you found, then copy the code below and put this code above

/* Object Dock Nav */ .dock { position: relative; height: 50px; text-align: center; } .dock-container { position: absolute; height: 50px; background: url(http://i947.photobucket.com/albums/ad311/sasukejaya/Query%20Bg/BGDock1.png); padding-left: 20px; } a.dock-item { display: block; width: 40px; color: #FFFFFF; position: absolute; top: 0px; text-align: center; text-decoration: none; font: bold 12px Arial, Helvetica, sans-serif; } .dock-item img { border: none; margin: 5px 10px 0px; width: 100%; } .dock-item span { display: none; padding-left: 20px; }

Next:

after you put the script again then copy the code below and put it right under this code:
]]></b:skin> same as above code except that you put this script at the bottom:


<script Gantitype='text/javascript' src=' http://h1.ripway.com/sasukejaya/Query/Query.js '/> <script src=' http://h1.ripway.com/sasukejaya/Query/Query.2.js ' type='text/javascript'/>

I give the code red, you can store it to your provider first and use your provider.
after the first step was completed
- then the next step, you are looking for more of this code:


<div id='outer-wrapper'> <div id='header-wrapper'>

-after you find another, copy the code below and put the code below:


<div class='dock' id='dock'> <div class='dock-container'> <a class='dock-item' href='http://www.dolarcafe.co.cc/'><img alt='home' src='http://i947.photobucket.com/albums/ad311/sasukejaya/Query%20Bg/Home-1.png'/><span>::HOME::</span></a>

<a class='dock-item' href='Replace with your URL'><img alt='contact' src='http://i947.photobucket.com/albums/ad311/sasukejaya/Query%20Bg/Satellite-1.png'/><span>::FACEBOOK::</span></a>
<a class='dock-item' href='Replace with your URL'><img alt='portfolio' src='http://i947.photobucket.com/albums/ad311/sasukejaya/Query%20Bg/MyYahoo-1.png'/><span>Internet</span></a>

<a class='dock-item' href='Replace with your URL'><img alt='music' src='http://i947.photobucket.com/albums/ad311/sasukejaya/Query%20Bg/Airport-1.png'/><span>Travel</span></a>

<a class='dock-item' href='Replace with your URL'><img alt='video' src='http://i947.photobucket.com/albums/ad311/sasukejaya/Query%20Bg/BisnisOnline-1.png'/><span>::Money::</span></a> </div> </div> <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: 40, proximity: 90, halign : &#39;center&#39; } ) } ); </script>

You must ask why there is a Red color and Fink, who I give these colors, that you may be setting itself, as to the color Red, for your URL, while Fink is the Icon color from the menu you can change it according to your taste .
done already, you stay hit save Template, then see the results on your blog good luck and enjoy whit the new menu.