Sismo Navigation v 1.0 – documentation
Sismo Navigation is a plugin that adds extra functionality to bootstrap. Sismo Navigation lets in you to create 6 differing types of navigation for internet packages html5 computer or mobile. With just changing a line of code.
Samples and Doctors
Navigation sorts
- Grid Navigation.
- Record Navigation
- Listing 2 Navigation
- Icon Navigation
- Backside Navigation
- Off Canvas Navigation
Information Construction
- – /property
- - bg.jpg
-
- – /medical doctors
- - references.pdf
- - tutorials.pdf
-
- – /js
- - sismo.js
-
- – /tools
- - bootstrap
- - font-superior
- - jquery
-
- – /style
- - sismo.navigation.css
-
- – index.html
Install
This navigation may also be built-in into any HTML or PHP web page.
BACKUP BACKUP BACKUP IT IS vital to keep a contemporary reproduction of the information on this plugin, like your web site to take a look at to change.
Unzip the files, be certain that to test it’s contents in opposition to the above report checklist
Getting Started
Within The header of your web page make certain to incorporate, CSS Taste and Javascript files. Reproduction the code beneath among your <head> and </head> tags both in your ‘header’ record or the top of the file.
<link href="tools/bootstrap/css/bootstrap.min.css" rel="stylesheet"> <hyperlink href="resources/font-awesome/css/font-superior.min.css" rel="stylesheet"> <hyperlink href="taste/sismo.navigation.css" rel="stylesheet"> <script src="resources/jquery/jquery-1.10.2.min.js"></script> <script src="js/sismo.js"></script>
Subsequent, indicates the type of navigation you want to make use of.
<script> Sismo.ready(serve as() Sismo.create("Navigation",); </script>
you can change the type of navigation you want to use for any of the next:
- .- navigation-grid
- .- navigation-bottom
- .- navigation-record
- .- navigation-list-2
- .- navigation-icon
- .- navigation-off-canvas
Next, Copy and paste the following code between the <body></body>
<div identity="navigation"> <ul> <li elegance="field-nav-item"> <a category="box-nav-link" href="#!"> <span elegance="fa icon fa-celebrity"></span> <span magnificence="tag-nav-menu">Menu 1</span> </a> </li> <li class="box-nav-merchandise"> <a class="field-nav-hyperlink" href="#!"> <span magnificence="fa icon fa-superstar"></span> <span elegance="tag-nav-menu">Menu 2</span> </a> </li> <li magnificence="field-nav-item"> <a class="field-nav-hyperlink" href="#!"> <span class="fa icon fa-megastar"></span> <span class="tag-nav-menu">Menu THREE</span> </a> </li> <li class="field-nav-item"> <a class="box-nav-link" href="#!"> <span magnificence="fa icon fa-superstar"></span> <span elegance="tag-nav-menu">Menu FOUR</span> </a> </li> </ul> </div>
Remaining, test in your internet browser
the overall code will have to look like this:
<!DOCTYPE html> <html lang="en"> <head> <hyperlink href="instruments/bootstrap/css/bootstrap.min.css" rel="stylesheet"> <link href="resources/font-superior/css/font-awesome.min.css" rel="stylesheet"> <link href="style/sismo.navigation.css" rel="stylesheet"> <script src="tools/jquery/jquery-1.10.2.min.js"></script> <script src="js/sismo.js"></script> <script> Sismo.ready(serve as() Sismo.create("Navigation",); </script> </head> <frame> <div id="navigation"> <ul> <li class="field-nav-merchandise"> <a category="field-nav-link" href="#!"> <span magnificence="fa icon fa-celebrity"></span> <span magnificence="tag-nav-menu">Menu 1</span> </a> </li> <li elegance="field-nav-item"> <a class="field-nav-hyperlink" href="#!"> <span elegance="fa icon fa-famous person"></span> <span class="tag-nav-menu">Menu 2</span> </a> </li> <li magnificence="field-nav-merchandise"> <a category="field-nav-link" href="#!"> <span elegance="fa icon fa-star"></span> <span elegance="tag-nav-menu">Menu THREE</span> </a> </li> <li magnificence="field-nav-item"> <a category="field-nav-hyperlink" href="#!"> <span elegance="fa icon fa-big name"></span> <span elegance="tag-nav-menu">Menu FOUR</span> </a> </li> </ul> </div> </body> </html>
Finished, how easy used to be that?!
Utilization Examples
you can view a few examples created with Sismo Navigations at the following URL: http://sismo.sistev.com.ve/navigations/index.html
Credits
- Bootstrap
- jQuery
- FontAwesome
FAQ
- For other functions sismo.js see reference document (references.pdf) found in the doctors folder.
- For tutorials on how to use the plugin you can see the tutorials.pdf record within the medical doctors folder.
- If you need, obtain the examples you'll be able to ship an email to the following address: sistev.contacto@gmail.com
FULL DOWNLOAD
