When you visit few sites you see a navigation menu that sticks to the top of your window as you scroll down a page. So you never have to scroll back to the top of a page to navigate the menu. In this tutorial, I'll show you how to create this Flating Nar Bar
Step 1: Locate the custom/default NAvBar location
Step 2 : Admin Cp >> Templates & Styles >> Templates >> your theme >> Header Templates > Edit Header >> Now add the codes given below anywhere you need. If you have a NavBar, paste the codes between the codes. This is the location is my Navbar
Now save the codes..
Step 3: Now go to theme >> your theme >> Add style sheets
File name : onlinedevelopersnoti .css
Attached to : Globally
then choose write my own content. Then paste the css cods given below and save it
If you Don't have a custom NavBar Here is a simple one, Place it between the First code. The NavBar given Below is an example there are no styles added
Coming Soon: Attractive Floating Announcement Bar http://community.mybb.com/thread-180205.html and more
Step 1: Locate the custom/default NAvBar location
Step 2 : Admin Cp >> Templates & Styles >> Templates >> your theme >> Header Templates > Edit Header >> Now add the codes given below anywhere you need. If you have a NavBar, paste the codes between the codes. This is the location is my Navbar
Quote: <div id='onlinedevelopersnoti' style='display: block; margin-top: 0px;'>
( NAVBAR codes Here | If you have a custom made Navbar codes place it here. )
</div>
Now save the codes..
Step 3: Now go to theme >> your theme >> Add style sheets
File name : onlinedevelopersnoti .css
Attached to : Globally
then choose write my own content. Then paste the css cods given below and save it
Quote:#onlinedevelopersnoti {
display: none;
margin: 0;
padding: 0;
position: fixed;
margin-top: -41px;
z-index: 999999;
width: 100%;
height: 41px;
}
If you Don't have a custom NavBar Here is a simple one, Place it between the First code. The NavBar given Below is an example there are no styles added
Quote:<ul>Now check you site, you will see a floating NavBar, If you need more detailed description with image, then contact me or replay . hope you have understood.
<li class="last"><a href="rules.php"><span>Rules</span></a></li>
<li class="last"><a href="about.php"><span>About Us</span></a></li>
<li class="last"><a href="myawards.php"><span>Awards</span></a></li>
<li class="last"><a href="stickies.php"><span>All Stickies</span></a></li>
<li class="last"><a href="contact.php"><span>Contact</span></a></li>
</ul>
Coming Soon: Attractive Floating Announcement Bar http://community.mybb.com/thread-180205.html and more