Change The Blogger Navbar To Hover Effect / Peek A Boo Effect

In an earlier post i covered Removing the blogger navbar completely.This is quiet a popular post as many dont like the navbar, but it can be useful.The navbar has progressed over the years to include extra options such as bookmarking and of course has the quick links into your account.So how about a hover effect navbar ?.Basically the navbar will only appear when you place your cursor over the space were it sits.Take a look at the demo below and place your cursor over the area were the navbar should be.



Removing navbar and setting peek-a-boo effect are not against blogger T.O.S.We set navbar to hover effect in three easy steps.

Have Hover Effect Blogger Navbar



1.Select 'Design' then 'Edit Html' for your blog.

2.Find this piece of code in your blogs html :

]]></b:skin>

3.Add the code below just BEFORE ]]></b:skin>

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}


Click save template and that's it check out your blog with its new hover navbar.

Just remove the code to set the navbar back to standard or to see how to remove it completely -Remove Blogger Navbar