Tuesday 13 March 2012

Hide Navbar until Pointed by Mouse

Today I am going to show you how you can hide the Navbar of Blgger until the user points the mouse to the navbar area.
You can the example of this. Just move your pointer above the Header and you can see the hidden navbar again.So let's start:

  1. Go to Design
  2. Click Edit Html
  3. Press F3 and search for this code  ]]></b:skin>
  4. Paste this code
#navbar-iframe{
    opacity:0.0;
    filter:alpha (Opacity=0)
}
 
#navbar-iframe:hover{
    opacity:1.0;
    filter:alpha (Opacity=100, FinishedOpacity=100)
}

Now save the template .

No comments: