Description
Incoded JSON MENU is not just HTML / CSS web page element. the major idea is to retailer menu items in database. Then, the usage of API, AJAX and Javascript element, menu will be generated on frontend. With simple implementation, responsive and beautiful themes, font superior icons and options it comprises, JSON MENU is a component useful for a wide variety of websites and programs. it would be built-in to an easy web page as easy as to an entire answer like Wordpress or Android software.
Easy Demo
Incoded JSON MENU Element will convert JSON like this:
into the menu like this:
Here’s flowchart that describes in main points how the part works:
Options
- Bootstrap supported
- Font Superior icons supported
- EIGHT different subject matters
- EIGHT different fonts
- Responsive
- A Couple Of menu instances on a unmarried page
- Submenus
- AJAX request to backend to get menu structure in JSON
- Verical and horisontal menu
- Justified and non-justified menu pieces
Requirements
- jQuery
Additionaly, you may include Bootstrap to combine JSON Menu into its structure.
Or you may include Font Superior icons, for example, to make use of it in menu items.
Quick Setup
CSS
Come With those css information within the <head> of your page:
<hyperlink rel="stylesheet" href="css/incoded-menu.min.css">JavaScript
Come With those javascript recordsdata in the bottom of the < body > of your page:
<script src="js/jquery.min.js"></script> <script src="js/incoded-menu.min.js"></script>Menu Holder
Upload a placeholder for your menu with unique IDENTITY:
<div identity="menu"> </div>Menu JSON
Open “api/menu.json” and alter it consistent with your wishes and menu you like to turn:
"id": 1, "order": 0, "name": "Home", "url": "/index.html" , "id": 2, "order": 1, "name": "About", "url": "/about.html" , "id": 3, "order": 2, "name": "Themes" , "id": 4, "order": 3, "name": "Contact", "url": "/contact.html" , "id": 5, "order": 0, "name": "Jeans", "parent_id": 3, "url": "/themes/jeans.html" , "id": 6, "order": 1, "name": "Pink", "parent_id": 3, "url": "/themes/pink.html"Menu Example
Add the next code on the very bottom of the < body > of your page:
<script type="textual content/javascript"> $(function() new IncodedMenu('#menu'); ); </script>Full Documentation
Topics
To See all themes, click here
Changelog
v2.0.0 November 15, 2015
- Introduced new themes
- Delivered fonts as choices
- Make the part lighter by way of taking out dependencies
- Updated product structure
v1.1.1 March 28, 2015
- Removed jQuery UI from dependencies
- Code optimization of top javascript
v1.1.0 January 17, 2015
- Brought beef up for vertical menu
v1.0.0 January 15, 2015
FULL DOWNLOAD
No comments:
Post a Comment