jQuery Gooey Tab Menu For Blogger

<script>
gooeymenu.setup({id:'gooeymenu4', selectitem:0, snapdelay:500})

</script>

 

Just edit the yellow highlighted part with your page titles and Urls. Replace the # signs with your page URLs. To add another another tab simple create another li tag area and add it above </ul> as shown  below,

<li><a href="#">Page Name</a></li>

To change the border colour replace #FFA500 with any hexadecimal color code of your choice. Use our color wheel or chart [a href="http://www.mybloggertricks.com/2008/11/mbt-tools-tos.html" target="_blank"]Tools[/a].

[a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGhYIAyRwUmKOs50UPUk_6osqj_3xPF-Yl9EgrCTUTPJQarQvrn9_ySIdOZWzD-W4rvMIpWmCaBFDI2vVpBzDLwnLiZcyjLE_8WMB1Ie0FXwIXmZefNtDkOVcB7LmVDOvvkJkvuQAMMRU/s1600-h/image%25255B14%25255D.png"][/a]

To change the rounded borders of frame to rectangular then simple delete the following code from above,

border-radius:15px; -moz-border-radius:15px;

    4.   Save and you are all set and done!

Visit your blogs to see the new navigation menu hanging just below your header. Let your visitors better explore your site by providing with something that may be worth trying. I will publish more versions of this effect soon so stay tuned. Have fun buddies! :)

*Menu by [a href="http://www.dynamicdrive.com/dynamicindex1/gooeymenu.htm" target="_blank"]dynamic drive[/a], Bloggerized by MBT.

Source: http://www.mybloggertricks.com/2011/09/jquery-gooey-tab-menu-for-blogger.html