Ads

Blogger Navbar Using JQuery

About Blogger Navbar again the most rare interest to Blogger because it is considered disturbing the landscape. Actually I never discussed this problem but the Blogger NavBar at the previous postings using only CSS Code which is quite easy to apply by Blogger beginners though.
The two ways that I post that is Remove the Blogger Navbar and Blogger Navbar Appear And Disappear or in other words can come and hide, appear when highlighted with the mouse and hide if not highlighted with the mouse, please go back if my friend forgot or never read it .
Now for that now is the same with the Blogger Navbar Appear And Disappear difference for this one makes use JQuery is quite small although it does not require any complicated code that much. This method uses JavaScript so that can become transparent and Navbar buddies can arrange this Navbar transparent effects ranging from 0% (Normal Condition) up to 100% (Not Visible).
If my friend wants to learn or just want to try to just please read the following ways:

1. Login to Blogger.com.
2. Click Design which is a change from the Layout.
3. Click the Edit Html Menu and uncheck Expand Widget Templates.
4. Search code </head>.
5. If you have found a copy code below and paste it in the code earlier.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$("#navbar").fadeTo("slow",
0.1
);
$("#navbar").hover(function(){
$(this).fadeTo("slow",
1.0
);
},function(){
$(this).fadeTo("slow",
0.1
);
});
});
</script>


Little explanation, I figure the red print
0.1
shows the effect of transparency of the navbar 90% and if you want change do not look at all figures
0.1
with
0.0
.
If you wish to remain in a state Navbar transparent when the mouse is at the point instead of numbers
1.0
I have a yellow print
0.75
to get a transparent effect for 25%.

6. Done, see the changes by clicking the green button marked Image and if it is in accordance with the wishes Click Save Template.


How my friend is not easy enough, well please in practice and good luck.


Source Script: Blog Music Indo