• loading...

Tooltip Effect Navigation Menu Widget For Blogger


- No comments
Tooltip effect navigation menu bar widget for blogger. It displays the name of the icon when you hover your mouse over the icon on the menu. Created in HTML and CSS.
Tooltip Effect Navigation Menu Widget For Blogger
This navigation menu is created in html and css. Below is the download icon through which you can download the entire full code. You have to copy the complete code of this widget and paste it in the gadget and you are done. It works fine with almost every browser. So use it freely and make your blogger template more attractive and user friendly. by avdhootblogger
How to add this navigation menu widget to blogger.
  • Go to blogger.
  • Go to layout.
  • Click on add a gadget.
  • Choose HTML/Javascript box.
  • Copy the below code after downloading it.
  • And paste the code into an HTML/Javascript gadget.
That's all. You are done.

Html code customization

As you can see in the code. There are two layers of menu. The first is with the icons and second is with the text.

If you want to change the icon than replace the default icons with your icons.
And if you want to change the text then replace the default like home, blog, action and others with your texts.
<nav>
<menu>
<li><a href="#">☀</a></li>
<li><a href="#">✈</a></li>
<li><a href="#">❄</a></li>
<li><a href="#">☎</a></li>
</menu>
</nav>
<nav class="menu2">
<menu>
<li><a href="#">HOME</a></li>
<li><a href="#">BLOG</a></li>
<li><a href="#">ACTION</a></li>
<li><a href="#">NEWBIE</a></li>
<li><a href="#">SLOW</a></li>
</menu>
</nav>
You can see the icon of flower, airplane and telephone. You can change this with yours and in menu 2 you can change home, blog, action, newbie and slow with your own.

It has tooltip effect when you hover your mouse over the icon all the text and icon move towards the up and their background become brighter and it is called tooltip effect.

Save Template and that's it. Now Tooltip Effect Navigation Menu Widget For Blogger should appear everywhere. Enjoy, share, comment! Thanks

Credits: Avdhootblogger

No comments :

Post a Comment