Introduction:

Discover our free browsing collection, with responsiv web design, using jquery and bootstrap. Our collection is composed by three bare of navigation in different style, using css style. For each nav bar is composed of seven nav bar items and a drop down sub menu and sub menu item. In order for you to modify the browsing needs of your needs, follow our integration guide. Test a free version on webi4u.com, and download the complette version on our github account.

Plant of the guide

At the end of this course, you will be able to:

Prerequisites: (5)

Before starting this guide, you must already have the following skills:

Part 1: Add, delete, update nav bar item?

The navbar item is a nested DIV, and for each nav bar item contains a label in an EM tag.

            
<!-- nav bar -->
<nav class="nav_bar">
    <!-- nav bar item -->
    <div class="nav_bar_item">
        <div>
            <!-- nav bar item label -->
            <em>
                HOME
            </em>
        </div>
    </div>
</nav>
Part 2: How add, delete, update drop down menu?

The drop downs are developed as for nav bar items are DIV whose position is absolute. you can simply add drop down as you want in the other nav bar

<!-- nav bar -->
<nav class="nav_bar">
    <!-- nav bar item -->
    <div class="nav_bar_item">
        <div>
            <!-- nav bar item label -->
            <em>
                HOME
            </em>
            <!-- drop down menu -->
            <div class="sub_menu">
                <!-- drop down menu item -->
                <div class="sub_menu_item">
                    <div>
                        <!-- label -->
                        <em>
                            SUB MENU ONE
                        </em>    
                    </div>
                </div>                     
            </div>
        </div>
    </div>
</nav>