Awesome 3D flipping menu for blogger

Hi guys to I’m going show how to add flip (3D) menu for blogger as I tell menu previously I posted many of them checkout and this one 3D flipping and this will supports only chrome and safari browser I assume all using chrome and other browsers just rotates and show reverse of them to add this one to your blog or website also possible steps to follow

Adding menu

Demo

1.      Login to blogger account

2.      Click layout

3.      Click on Add a Gadget

4.      Scroll down and find HTML/JavaScript

5.      Leave title blank and Copy and paste the below code in content

6.      Click on save to save your work

7.      Replace http://vbdotnetcod.blogspot.com as your links

Code:

<style> <!-- ul{ list-style: none; } ul li a{ float: left; padding: 10px 20px !important; text-decoration: none; color: #000; background-color: #F08501; -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; margin: 2px; font-size: 18px; font-family: impact; box-shadow: 0px 0px 0px #000; } #conti div{ -webkit-perspective: 500; -o-perspective: 500; -moz-perspective: 500; } #conti div a:hover{ -webkit-transform: rotateY(180deg); -o-transform: rotateY(180deg); -moz-transform: rotateY(180deg); box-shadow: 0px 4px 0px #000; } --> </style> <ul> <li><div id="conti"> <div> <a href="http://vbdotnetcod.blogspot.com">Home</a></div> </div> <li> <li><div id="conti"> <div> <a href="http://vbdotnetcod.blogspot.com">Download</a></div> </div> <li> <li><div id="conti"> <div> <a href="http://vbdotnetcod.blogspot.com">Software</a></div> </div> <li> <li><div id="conti"> <div> <a href="http://vbdotnetcod.blogspot.com">Links</a></div> </div> <li> </ul>